HTML — это язык гипертекстовой разметки, с помощью которого производится форматирование веб-документов. Он предоставляет основные возможности составления структуры документа, а также базовые варианты оформления страницы. В этой статье подробно расскажем, как изменить размер текста в HTML. Узнаем, в каких случаях можно задействовать только HTML, а когда предпочтительнее прибегнуть к стилевым таблицам CSS.
Изменение размера при помощи тега <font>
Существует несколько различных способов, при помощи которых можно выполнить изменение размера текста в HTML. Такие возможности представляет как сам язык веб-разметки, так и подключаемые к документу таблицы стилей CSS.
Первый способ увеличить или уменьшить текст на веб-странице — это использование тега <font>. Синтаксис при использовании данного тега будет следующим:
<font size="3" color="green" face="Georgia">Текст для примера</font>Давайте рассмотрим данный пример подробнее. Как видите, здесь указано три атрибута тега <font>, которые позволяют задавать гарнитуру, размер и цвет текста HTML.
За размер отвечает атрибут size — он позволяет задавать размер текста в условных единицах. За среднее значение данного параметра принимается 3. Соответственно, задавать его можно как в абсолютных единицах (то есть 1, 7, 4 и т.д.), так и в относительных - с помощью знаков плюса или минуса (+3, -2). Во втором случае размер текста будет изменен по отношению к базовому.
Атрибут color показывает, какого цвета будет отображаемый текст, а face отвечает за гарнитуру (шрифт). Таким образом, текст на примере будет стандартного среднего размера по умолчанию, зеленого цвета, написан шрифтом Georgia.
В современных браузерах этот способ изменения размера текста в HTML практически всегда работает, однако данный способ считается несколько устаревшим — рекомендуется использовать возможности форматирования посредством CSS.
Другие способы уменьшения и увеличения текста в HTML
Для того чтобы изменить размер текста в HTML, также используются теги <big> и <small>.
Употребляются эти теги следующим образом:
<big>Этот текст будет крупнее</big>
<small>Этот текст будет меньше</small>Интересно, что для того, чтобы сделать текст еще больше или меньше, тег можно повторить несколько раз.
<big><big>Этот текст будет увеличен еще сильнее</big></big>Помимо этих двух тегов, есть возможность использования для изменения размера текста в HTML заголовков (к примеру, H1 для того, чтобы задать большой текст, и H6 для уменьшения его размера). Однако делать этого не рекомендуется, поскольку заголовок является структурирующей единицей веб-страницы, и использование его для визуального форматирования может затруднить индексацию и доступность сайта.
Изменение размера текста с помощью CSS
Для того чтобы менять размер текста, рекомендуется использовать средства CSS. Синтаксис будет выглядеть следующим образом:
p {
font-size: 11pt;
}Для этого способа доступно гораздо большее количество возможностей. Можно менять размер текста в различных единицах, таких как пункты (pt), пиксели (px), проценты и другие.
Данный метод используется либо посредством тега <style> непосредственно в теле HTML-документа, либо посредством внешней таблицы стилей, подключенной отдельным файлом со ссылкой в документе.
Разработчики единодушны во мнении, что с учетом оптимизации и кроссбраузерности в наше время предпочтительнее использовать для стилизации и дизайна именно возможности CSS, а для HTML оставить его изначальную функцию языка разметки гипертекста.
Итак, мы познакомились с несколькими различными способами изменения размера текста в HTML-документах. Какой из них использовать — зависит от ваших потребностей и желаемого функционала страницы.
