В этом посте будет подробно рассмотрен метод улучшения читаемости с помощью изменения размера шрифта.
Как улучшить читаемость с помощью изменения размера шрифта?
Читабельность шрифтов можно повысить, воздействуя на различные факторы. Например, увеличение длины строки до немного большего размера. Кроме того, используйте подходящее семейство шрифтов и правильный размер шрифта. Однако, чтобы на практике научиться улучшать читаемость с помощью изменения размера шрифта, выполните следующие действия:
Шаг 1. Создайте структуру HTML
Начните с создания <дел> с именем класса « содержание ». После этого добавьте некоторый контент внутрь <дел> ярлык:
< тело >
< div сорт '=' 'содержание' >
< ч1 > Добро пожаловать в Linux Hint. < / ч1 >
< п > Популярный портал Linux Hint предоставляет отличную информацию по темам информатики. < / п >
< / div >
< / тело >
Шаг 2. Примените CSS
Сначала установите « размер шрифта ' к ' 16 пикселей » и «line-height» на « 1,5 ». Кроме того, также установите шрифт для и <р> теги:
тело {
семейство шрифтов: без засечек;
шрифт- размер : 18 пикселей;
линия- высота : 1,5 ;
}
ч1 {
текст- выровнять : центр;
шрифт- размер : 26 пикселей;
}
п {
шрифт- размер : 18 пикселей;
}
Выход
Вот вывод кода, который подходит для всех размеров экрана:
Шаг 3. Примените медиа-запрос
- Во-первых, упомяните '@упомянуть' тег и укажите размер экрана» 768 пикселей » к « Максимальная ширина ' свойство. Этот размер экрана будет применяться ко всем экранам, размер которых равен или меньше « 768 пикселей ».
- После этого укажите размер шрифта для <тело> , , и <р> теги:
тело {
шрифт- размер : 16 пикселей;
линия- высота : 1,5 ;
}
ч1 {
шрифт- размер : 22 пикселей;
}
п {
шрифт- размер : 14
}
}
Ниже приведен результат применения медиа-запроса. Медиа-запрос был разработан для устройств с размером экрана, равным или меньшим « 768 пикселей »:
Заключение
Чтобы улучшить читабельность за счет изменения размера шрифта, сначала разработайте ощущение читабельности и размера шрифта. Кроме того, разберитесь в различных размерах шрифтов и тегах шрифтов. Выберите подходящий размер шрифта, а затем выберите подходящую высоту строки. Обычно высота строки в 1,2 раза превышает размер шрифта. Кроме того, выберите семейство шрифтов, подходящее для веб-контента. В этой статье продемонстрирован практический способ улучшить читаемость с помощью изменения размера шрифта.