Как изменить шрифт в HTML

Раздел:
Сайтостроение /
HTML /

Шрифт (нем. Schrift от schreiben «писать») — это (согласно Википедии) графический рисунок начертаний букв и знаков, составляющих единую стилистическую и композиционную систему, набор символов определённого размера и рисунка.

Понятно, что если бы тексты всех сайтов использовали шрифты по умолчанию,
то это было бы очень скучно. Поэтому веб-мастера стараются как-то выделить
свой сайт из множества других, и применяют различные шрифты. В современном
сайтостроении это обычно делается с помощью CSS, однако во многих случаях можно использовать старый добрый HTML.

Поскольку эта статья для начинающих, то мы будем использовать для изменения
шрифта тег <font>, который в HTML4 уже использовать не советуют. Однако он поддерживается всеми браузерами и, скорее всего, будет поддерживаться и дальше.

С помощью тега <font> можно изменять стиль, цвет и размер
текста. Основные атрибуты тега <font>:

• color — устанавливает цвет текста.
• face — изменяет шрифт в HTML (это как раз то, что нам нужно).
• size — устанавливает размер букв.

С цветом, думаю, всё понятно. Также надеюсь, что вы помните, как использовать
атрибуты тегов. Если нет, то см. здесь.
К тому же изменять цвет текста мы уже умеем — я рассказал об этом
здесь.

Теперь о том, как изменить шрифт текста в HTML. Для этого используется
атрибут face. Если хотите, чтобы текст выводился одним определённым шрифтом, то сделать это можно так:

<font face="Arial">
Для этого текста установлен шрифт Arial
<font>

В этом примере текст будет выводиться шрифтом Arial. То есть в качестве параметра атрибут принимает название шрифта. Если браузер знает такой шрифт и может его отобразить, то текст будет выведен указанным шрифтом.

Если вы используете какой-то редкий шрифт, и не уверены, что на компьютере пользователя такой шрифт имеется, то желательно с атрибутом face использовать несколько шрифтов, перечисленных через запятую:

<p>
<font face="MyFont, Verdana, Arial">
Для этого текста установлен шрифт MyFont
<font>
</p>

Здесь первым в списке указан шрифт MyFont,
которого, конечно же, браузер не знает. В таких случаях, если браузеру
шрифт неизвестен, он будет выводить текст шрифтом, указанным следующим
в списке. В нашем примере текст будет выведен шрифтом Verdana.
Если бы и этого шрифта в закромах браузера не оказалось, то он бы вывел
текст шрифтом Arial.

Если же ни один из указанных шрифтов браузеру неизвестен, то текст будет выводиться шрифтом по умолчанию.

На рисунке пример отображения текста несколькими шрифтами:

В теге <font> это можно сделать с помощью атрибута size. Размер может быть абсолютным и относительным.

Абсолютный размер устанавливается путём передачи в атрибут непосредственного значения от 1 до 7. Например, ниже мы устанавливаем для шрифта размер 3:

<font size="3">
Размер шрифта 3
<font>

Если установить атрибут size менее 1 или более 7, то браузер автоматически ограничит размер шрифта. Пример вы можете увидеть на рисунке ниже — несмотря на то, что мы попытались установить размер 8, браузер отобразил шрифт таким же размером, как и размер 7.

Относительный размер устанавливается путём передачи в атрибут числа со знаком + (плюс). Например, вот такой HTML-код:

<p>
<font size="3">
Размер шрифта 3
<font>
</p>

<p>
<font size="+2">
Размер шрифта 5 (3 + 2)
<font>
</p>

<p>
<font size="5">
Размер шрифта 5
<font>
</p>

Здесь мы сначала установили шрифт размером 3. Затем увеличили этот шрифт на 2 (то есть сделали размер шрифта равным 5). Ну а далее, чтобы убедиться, что это всё правильно работает, снова установили абсолютный размер шрифта. На рисунке ниже видно, что это действительно работает так, как и задумывалось:

Относительный размер удобно использовать тогда, когда вы почему-то не уверены, какой размер был установлен ранее, и хотите выделить какой-то участок текста шрифтом большего размера. Используя относительный размер в таких случаях вы можете быть уверены, что выделенный шрифт будет больше окружающего текста (разумеется, надо помнить, что размеры шрифта могут быть от 1 до 7).

Но эта необходимость возникает довольно редко. В большинстве случаев следует использовать абсолютный размер шрифта в HTML, потому что это более наглядно смотрится в коде страницы, и так вы избежите неприятностей, которые могут возникнуть при относительном размере.

Для лучшего понимания посмотрите видео (выше) и изучите
курс о вёрстке сайтов.

HTML: форматирование текста | СХОСТ блог

Рассмотрим несколько важных моментов форматирования текста в HTML:

• <strong> и <b> 一 выделение текста.

• <i> и <em> 一 курсив.

• <u> 一 подчеркнутый текст.

• <sup> и <sub> 一 надстрочный индекс.

Например:

<html>

<head>

<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″>

<title>Форматирование текста</title>

</head>

<body>

<p><strong>Содержание:</strong></p>

<ul>

<p dir=»ltr»><li><em>Работа со шрифтами. </em></li></p>

<p dir=»ltr»><li><u>Создание блока с отступом.</u></li></p>

<p dir=»ltr»><li>Цвет, стиль и размер ^{шрифта.}</li></p>

<p dir=»ltr»><li>Переход на следующую строку и _{выравнивание текста .}</li></p>

</ul>

</body>

</html>

Текст в браузере:

Создание блока с отступом. За создание блока с отступом отвечает тег <BLOCKQUOTE>. например:

<p><strong><BLOCKQUOTE>Содержание:</BLOCKQUOTE></strong></p>

Текст в браузере:

• Цвет, стиль и размер шрифта. Данные параметры задаются тегом <BASEFONT>, имеющим несколько атрибутов: color = (цвет шрифта), size = (размер шрифта), face = (перечень названий шрифтов). Для того, чтобы изменить размер шрифта, воспользуйтесь атрибутом size тега <font>. Чтобы поменять цвет шрифта, воспользуйтесь атрибутом color тега <font>. Чтобы добавить шрифт, нужен атрибут face тега <font>.

Например:

<html>

<head>

<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″>

<title>Форматирование текста</title>

</head>

<body>

<p><strong><BLOCKQUOTE><font size=»2″ color= «FF0000»>Содержание:</font></BLOCKQUOTE></strong></p>

<ul>

<p dir=»ltr»><li><em><font size=»3″ color= «7FFF00»>Работа со шрифтами. </font></em></li></p>

<p dir=»ltr»><li><u><font size=»4″ color= «40E0D0»>Создание блока с отступом.</font></u></li></p>

<p dir=»ltr»><li><font size=»5″ color= «BA55D3»>Цвет, стиль и размер ^{шрифта.</font>}</li></p>

<p dir=»ltr»><li><font size=»6″ «FFFF00»>Переход на следующую строку и _{Hвыравнивание текста .</font>}</li></p>

</ul>

</body>

</html>

Текст в браузере:

<p dir=»ltr»><li><em><font size=»3″ color= «7FFF00»>Работа<br> со<br> шрифтами.<br></font></em></li></p>

Текст в браузере:

Как изменить размер шрифта в моем браузере

Обновлено: 03. 05.2022 автором Computer Hope

Изменение размера объектов в браузере может облегчить их просмотр или чтение. Чтобы изменить размер шрифта, мы рекомендуем использовать функцию масштабирования, так как изменения можно быстро и легко отредактировать или отменить. Он также работает со всеми типами контента. В следующих разделах показано, как быстро настроить размер шрифта и изображений на странице или только шрифт. Чтобы продолжить, выберите свой браузер из списка ниже и следуйте инструкциям.

Примечание

Выполняя описанные ниже шаги, вы увеличиваете масштаб страницы, а не изменяете размер шрифта, выбранный создателем страницы. В результате размер и тип шрифта остаются со значениями по умолчанию при печати документа или страницы из Интернета.

Кончик

Используя любой из перечисленных ниже браузеров, вы можете изменить размер шрифта с помощью клавиатуры и мыши. Нажмите и удерживайте Ctrl , затем переместите колесико мыши вверх или вниз. Кроме того, вы можете нажать и удерживать Ctrl (или Command на Mac), затем нажмите + или - (плюс или минус), чтобы увеличить или уменьшить размер шрифта.

Кончик

Все основные браузеры также поддерживают нажатие Ctrl + 0 (ноль), чтобы изменить размер шрифта на его размер по умолчанию.

• Гугл Хром
• Мозилла Фаерфокс
• Microsoft Edge
• Internet Explorer
• Опера
• Сафари для macOS
• Мобильное устройство

Гугл Хром

Чтобы изменить размер шрифта в Chrome, используйте один из следующих способов.

Изменить шрифт и размер изображения

1. Откройте браузер Chrome.
2. Щелкните значок Настройка и управление Google Chrome  в правом верхнем углу окна браузера.
3. В верхней части раскрывающегося меню вы можете использовать + (плюс) или — (минус) в разделе меню Масштаб , чтобы увеличить или уменьшить размер шрифта. Настройка масштаба Chrome по умолчанию составляет 100%.

Изменить только размер шрифта

1. Откройте браузер Chrome.
2. Щелкните значок Настройка и управление Google Chrome  в правом верхнем углу окна браузера.
3. Выберите Настройки из меню.

4. В левом навигационном меню выберите параметр Appearance .

5. В окне «Настройки» щелкните раскрывающееся меню в Запись размера шрифта в разделе Внешний вид .

6. Выберите нужный размер шрифта, который будет использоваться по умолчанию. Возможные варианты: Очень маленький , Маленький , Средний , Большой и Очень большой .

Примечание

С помощью селектора Настроить шрифты Chrome позволяет изменить шрифт и размер шрифта по умолчанию в браузере. Однако настройки работают только в том случае, если создатель страницы еще не указал их.

Примечание

Chrome также поддерживает указанный в начале этой страницы совет по изменению размера шрифта.

Мозилла Фаерфокс

Чтобы изменить размер шрифта в Firefox, используйте один из следующих способов.

Изменить шрифт и размер изображения

1. Откройте браузер Firefox.
2. Щелкните значок Меню  в правом верхнем углу экрана.
3. В верхней части выпадающего меню вы можете увеличить или уменьшить размер шрифта, нажав кнопку + (плюс) или — (минус) в разделе Zoom . Настройка масштаба браузера по умолчанию составляет 100%.

Изменить только размер шрифта

1. Откройте браузер Firefox.
2. Нажмите Меню  в правом верхнем углу экрана.
3. Выберите Настройки в раскрывающемся меню.
4. Нажмите Общие на левой панели навигации.

5. Прокрутите вниз до раздела Язык и внешний вид . В разделе Zoom вы можете изменить размер текста относительно остальной части страницы, установив флажок Zoom text only и отрегулировав процент масштабирования.

Примечание

Mozilla Firefox позволяет изменить шрифт браузера по умолчанию и размер шрифта. Однако настройки работают только в том случае, если создатель страницы еще не указал их.

Примечание

Mozilla Firefox также поддерживает указанный в начале этой страницы совет по изменению размера шрифта.

Microsoft Edge

Чтобы изменить размер шрифта в Edge, используйте один из следующих способов.

Изменить шрифт и размер изображения

1. Откройте браузер Microsoft Edge.
2. Нажмите Еще  (три горизонтальные точки) в правом верхнем углу окна.
3. Увеличьте или уменьшите размер шрифта, щелкнув + (плюс) или — (минус) в разделе меню Масштаб (вверху). Настройка масштаба браузера по умолчанию составляет 100%.

Изменить только размер шрифта

1. Откройте браузер Microsoft Edge.
2. Нажмите  Еще (три горизонтальные точки) в правом верхнем углу окна.
3. Выберите  Настройки из раскрывающегося меню.

4. В левой части окна Параметры щелкните селектор Внешний вид .

5. В правом окне прокрутите вниз до Шрифты раздел. Затем щелкните раскрывающийся список справа от Размер шрифта и выберите вариант, который лучше всего подходит для вас.

Примечание

В Edge вы можете щелкнуть селектор Настроить шрифты , чтобы изменить шрифт и размер шрифта по умолчанию в браузере. Однако настройки работают только в том случае, если создатель страницы еще не указал их.

Примечание

Microsoft Edge также поддерживает указанный в начале этой страницы совет по изменению размера шрифта.

Internet Explorer

Чтобы изменить размер шрифта в Internet Explorer, выполните следующие действия.

1. Откройте браузер Internet Explorer.
2. Нажмите  Инструменты в правом верхнем углу.
3. Наведите указатель мыши на Масштаб в появившемся раскрывающемся меню.

4. Выберите параметр масштабирования в расширенном меню, чтобы изменить размер текста.

Примечание

Internet Explorer также поддерживает указанный в начале этой страницы совет по изменению размера шрифта.

Опера

Чтобы изменить размер шрифта в Opera, используйте один из следующих способов.

Изменить шрифт и размер изображения

1. Откройте браузер Opera.
2. Щелкните значок Opera в верхнем левом углу окна браузера.
3. Увеличьте или уменьшите размер шрифта, щелкнув + (плюс) или — (минус) в разделе меню Масштаб . Масштаб в Opera по умолчанию равен 100%.

Изменить только размер шрифта

1. Откройте браузер Opera.
2. Щелкните значок Opera в верхнем левом углу окна браузера.
3. Выберите Настройки в меню.

4. В окне Настройки прокрутите вниз до раздела Внешний вид .
5. В разделе Внешний вид щелкните раскрывающееся меню для записи Размер шрифта .
6. Выберите желаемый размер шрифта, который будет использоваться по умолчанию. Вариантов Очень маленький , Маленький , Средний , Большой и Очень большой .

Примечание

С помощью селектора Настроить шрифты Opera позволяет изменить шрифт и размер шрифта по умолчанию в браузере. Однако настройки работают только в том случае, если создатель страницы еще не указал их.

Примечание

Opera также поддерживает указанный в начале этой страницы совет по изменению размера шрифта.

Сафари для macOS

В этом разделе показано, как увеличить размер шрифта при использовании Safari на настольном (iMac) или портативном (MacBook) компьютере.

1. Откройте браузер Safari.
2. В строке меню Apple в верхней части экрана щелкните селектор.
3. В появившемся раскрывающемся меню щелкните Увеличить или Уменьшить , чтобы настроить размер шрифта.

Кончик

Вы можете нажать и удерживать Command + + (плюс) или - (минус), чтобы увеличить или уменьшить размер шрифта.

Мобильное устройство

На мобильном устройстве вы можете сводить и масштабировать двумя пальцами, чтобы увеличить любой текст, который трудно прочитать.

Чтобы увеличить размер текста везде на устройстве, вы можете увеличить размер шрифта в приложении «Настройки».

iPhone или iPad

1. Откройте приложение Настройки .
2. Выбор Доступность > Крупный текст .

Мобильное устройство Android

1. Откройте приложение Настройки .
2. Выберите Специальные возможности > Текст и отображение > Размер шрифта .

Кончик

На некоторых телефонах Android настройки размера шрифта могут быть немного в другом месте или под другим именем настройки, в зависимости от производителя устройства.

• Как изменить язык по умолчанию в интернет-браузере.
• Как изменить поисковую систему вашего браузера по умолчанию.
• Как изменить домашнюю страницу моего браузера.
• Как изменить тему вашего интернет-браузера.
• Как сбросить настройки по умолчанию в интернет-браузере.
• См. определение шрифта для получения дополнительной информации и связанных ссылок.
• Справка и поддержка интернет-браузера.

Как увеличить размер шрифта в Chrome, Edge, Firefox и Opera

Автор
Ташриф Шариф

Опубликовано 29 октября 2021 г.

Если вы регулярно увеличиваете масштаб веб-страницы, вот как вы можете увеличить размер шрифта в большинстве браузеров.

Большинство веб-браузеров позволяют изменять их внешний вид, включая тему и характеристики шрифта. Хотя вы можете изменить размер шрифта, используя традиционную функцию масштабирования (Ctrl + колесико мыши вверх/вниз), это делает все остальное на странице большим.

К счастью, вы можете настроить тип и размер шрифта практически для всех браузеров, включая Chrome, Edge, Firefox и Opera. Вот как это сделать.

Как изменить размер и тип шрифта в Google Chrome

Процесс изменения шрифта и размера текста по умолчанию в Google Chrome прост. Вот как это сделать.

1. Нажмите Еще (три вертикальные точки) и выберите Настройки .
2. На вкладке «Настройки» откройте вкладку Внешний вид на левой панели.
3. На правой панели щелкните раскрывающийся список Размер шрифта . Он установлен на Средний (рекомендуется) по умолчанию, но вы можете выбрать Large/Very Large в зависимости от ваших требований.
4. Чтобы изменить тип шрифта, нажмите Настроить шрифты. Здесь вы можете изменить тип шрифта, ширину и многое другое.

Связано: Сомнительные расширения Google Chrome, которые следует удалить как можно скорее

Изменения, внесенные в браузер, вступят в силу немедленно. Если вы хотите восстановить свойства шрифта по умолчанию, перейдите в «Настройки » > «Сбросить » и выполните очистку, а затем нажмите 9.0474 Восстановить исходные настройки по умолчанию . К сожалению, нет возможности сбросить настройки шрифта по умолчанию, поэтому вам придется сбросить все.

Как изменить размер и тип шрифта в Microsoft Edge

У Microsoft Edge и Chrome много общего, поскольку они основаны на одной и той же платформе Chromium. Вот как настроить параметры передней панели в браузере Edge.

1. В браузере Edge щелкните значок Меню (три горизонтальные точки).
2. Выберите Настройки из контекстного меню.
3. На левой панели откройте вкладку Внешний вид .
4. Прокрутите страницу до конца и найдите раздел Шрифты .
5. Щелкните раскрывающийся список Размер шрифта и выберите Крупный или Очень крупный , чтобы увеличить размер текста.
6. Нажмите кнопку Настроить шрифты , чтобы дополнительно настроить тип шрифта и многое другое.

Связано: Microsoft Edge против Firefox в 2021 году: какой браузер победит?

Вы можете отменить настройку шрифта вручную. Однако, если это не сработает, перейдите в «Настройки » > «Сброс настроек» > «Восстановить настройки до их значений по умолчанию». Нажмите Сброс , чтобы подтвердить действие по сбросу настроек Edge.

Как изменить размер и тип шрифта в Firefox

Помимо обычной настройки типа и размера шрифта, Firefox позволяет изменять тип шрифта для нескольких языков. Вот как это сделать.

1. Запустите Firefox и нажмите Меню (значок гамбургера) в правом верхнем углу.
2. Выберите Настройки в меню.
3. На вкладке Общие прокрутите вниз до раздела Язык и внешний вид .
4. В разделе Шрифты и цвета можно изменить шрифт и размер по умолчанию .
5. Чтобы изменить цвет текста, фона и ссылок, нажмите кнопку Цвет .
6. Чтобы изменить тип шрифта для разных языков, нажмите кнопку Дополнительно .

Как изменить тип и размер шрифта в браузере Opera

Браузер Opera предлагает несколько удобных параметров настройки внешнего вида, включая возможность изменения типа и размера шрифта. Вот как это сделать.

1. Запустите браузер Opera и щелкните значок Easy Setup в правом верхнем углу.
2. Выбрать Перейти к полным настройкам браузера из контекстного меню.
3. На вкладке Настройка прокрутите вниз до раздела Внешний вид .
4. Здесь щелкните раскрывающийся список Размер шрифта и выберите Крупный или Очень крупный , чтобы увеличить размер текста. Щелкните Настроить шрифты для дальнейшего изменения свойств шрифта.

Упрощение чтения текста в разных браузерах

Если вы сидите в стороне от экрана или пытаетесь прочитать длинный рассказ, размер или тип шрифта вашего браузера по умолчанию может не обеспечивать идеального чтения.

К счастью, вы можете настраивать внешний вид таких браузеров, как Edge, Firefox, Chrome и Opera, включая размер и тип шрифта. Если вы не можете найти возможность настроить размер текста, обязательно обновите браузер, чтобы исправить любые сбои и восстановить отсутствующие функции.

Подписывайтесь на нашу новостную рассылку

Похожие темы

• Интернет
• Шрифты
• Гугл Хром
• Microsoft Edge
• Мозилла Фаерфокс
• Браузер Opera

Об авторе

Ташриф — разработчик и технический писатель в MUO. Имея степень бакалавра в области компьютерных приложений, он имеет более чем 6-летний опыт работы и занимается Microsoft Windows и всем, что с ней связано. Когда он не ищет пропущенную точку с запятой или печатает текст, вы можете найти его, пробующим названия FPS или ищущим новые анимационные шоу и фильмы.

This entry was posted in Популярное