Bulma — эффективная настройка размера типографики
Мне трудно найти наиболее эффективный способ изменить размер текста для мобильных устройств. Я знаю, что в соответствии с документация сделать размер текста, реагирующего на экран, довольно просто, просто добавьте класс is-size-*-mobile к элементу, чтобы сбросить размер текста до значения * (1-7) для мобильных устройств. Какие элементы лучше всего подходят для этого? Например, я хотел бы, чтобы весь текст на экране изменялся на размер 7 на мобильных устройствах, но до сих пор мне приходилось добавлять класс is-size-7-mobile почти в каждый текстовый контейнер на странице. Хотя это не невозможно сделать, кажется, что цель иметь такой класс, доступный через CSS, побеждает.
Мы будем очень благодарны за любые советы.
Ответы 1
Хотя им не хватает конкретного примера, эти Помощники типографики предназначены для добавления к элементу, содержащему контент, который вы хотите изменить..
Например, если вы хотите изменить весь документ, подумайте о том, чтобы добавить его прямо в элемент body:
<body class = "is-size-7-mobile layout-documentation page-helpers">
Приведенный выше пример работает на их странице документации, которая вам понравилась в вашем вопросе. Просто нажмите F12, добавьте модификатор и вуаля, вся страница изменит размер текста.