Подробная модификация различных форматов шрифтов веб -страниц HTML

Автор：Eve Cole Время обновления：2025-06-07 00:48:02

Этот раздел начинается с подробной модификации текста, позволяя читателям понять изменения в различных форматах шрифтов HTML и создавать более профессиональные веб -страницы.

4.2 Диверсифицированная модификация текста

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

4.2.1 Основные этикетки для настройки стиля текста - 

Основной тег для настройки стилей шрифтов - , а текст, содержащийся в нем, - это область действия стиля. При написании HTML -кода для начинающих легко вкладывается несколькими источниками, такими как <атрибут font 2 = value 2> Text . Другая ситуация - это смещение гнездования метки, такое как Text . Чтобы стандартизировать написание кода и избежать ненужных ошибок, читатели должны быть осторожны при обучении.

4.2.2 Установите цвет текста

Цвет является одним из атрибутов тега , который используется для установки цвета текста. Создайте файл веб -страницы в каталоге D:/ Web/ с именем FONT_COLOR.HTM и напишите код, как показано в коде 4.7.

Код 4.7 Настройка цвета шрифта: font_color.htm

<html>

<голова>

<Tilt> Настройки цвета шрифта </title>

</head>

<тело>

Световый красный текст: Суть HTML Learning - использовать то, что должно быть

Crimson Text: Суть HTML Learning заключается в том, чтобы использовать то, что должно быть

Светло -зеленый текст: Суть HTML Learning - использовать то, что должно быть

Темно -зеленый текст: Суть HTML Learning заключается в том, чтобы использовать то, что должно быть

Светло -голубой текст: Суть HTML Learning - использовать то, что должно быть

Темно -синий текст: Суть HTML Learning - использовать то, каким бы он должен быть

Свето -желтый текст: Суть HTML Learning - использовать то, каким бы он должен быть

Темно -желтый текст: Суть HTML Learning заключается в том, чтобы использовать то, что должно быть

Световой голубой текст: Суть HTML Learning заключается в том, чтобы использовать то, что должно быть

Темно -синий текст: Суть HTML Learning заключается в том, чтобы использовать то, что должно быть

Свето -фиолетовый текст: Суть HTML Learning - использовать то, что должно быть

Глубокий фиолетовый текст: Суть HTML Learning - использовать то, что должно быть

</body>

</html>

Введите http: //localhost/font_color.htm в адресной строке браузера, и эффект просмотра показан на рисунке 4.7.

Рисунок 4.7 Настройки цвета шрифта

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

4.2.3 Установите размер текста

Размер также является свойством тега , который используется для установки размера текста. Значение размера составляет 1-7, а по умолчанию - 3. Мы можем добавить + и - символы до значения атрибута размера, чтобы указать приращение или уменьшение относительно начального значения размера шрифта. Создайте файл веб -страницы в каталоге D:/ Web/ с именем font_size.htm и напишите код, как показано в коде 4.8.

Код 4.8 Настройка размера шрифта: font_size.htm

<html>

<голова>

<Title> Настройки размера шрифта </title>

</head>

<тело>

Размер 1: HTML Learning

Размер 2: HTML Learning

Размер 3: HTML Learning

Размер 4: HTML Learning

Размер 5: HTML Learning

Размер 6: HTML Learning

Размер 7: HTML Learning

</body>

</html>

Введите http: //localhost/font_size.htm в адресной строке браузера, и эффект просмотра показан на рисунке 4.8.

Рисунок 4.8 Настройки размера шрифта

Читатели могут попытаться добавить + и - символы перед значением размера, чтобы установить размер текста более гибко.

4.2.4 Установите шрифт текста

Лицо также является свойством тега , которая используется для установки текстовых шрифтов (шрифтов). Шрифты, отображаемые на веб -страницах HTML, вызываются из системы просмотра, поэтому для того, чтобы сохранить шрифт последовательным, рекомендуется использовать шрифт песни, а HTML -страницы также используют шрифт песни по умолчанию. Создайте файл веб -страницы в D:/ Web/ Directory с именем font_face.htm и напишите код, как показано в коде 4.9.

Код 4.9 Настройки шрифта шрифта: font_face.htm

<html>

<голова>

<Title> Параметры шрифта </title>

</head>

<тело>

Шрифт-песня шрифт: Qinyuanchun · Changsha-Mao Zedong

Шрифт в кайши: Qinyuanchun · Changsha-mao Zedong

Шрифт жирный: Qinyuanchun · Changsha-mao Zedong

Шрифт-это лишу: Qinyuanchun · Changsha-Mao Zedong

</body>

</html>

Введите http: //localhost/font_face.htm в адресной строке браузера, и эффект просмотра показан на рисунке 4.9.

Рисунок 4.9 Настройки шрифта

Автор устанавливает размер текста модифицированного шрифта на № 5 для читателей для просмотра.

4.2.5 Сделайте наклон текста

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

Это курсивный текст

это также курсив

4.2.6 Сделайте текст жирным шрифтом

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

это жирный текст

это также смелый текст

4.2.7 Подчеркните текст

Используйте двойные теги , чтобы добавить подчеркивание к приложенному тексту. Ниже приведен всеобъемлющий пример наклона текста, смелого и подчеркнутого. Создайте файл веб -страницы в каталоге D:/ Web/ с именем FONT_STYLE.HTM и напишите код, как показано в коде 4.10.

Код 4.10 Настройки изменения текста: font_style.htm

<html>

<голова>

<Title> Настройки модификации шрифта </title>

</head>

<тело>

курсив: Qinyuanchun · Changsha-mao Zedong

Жирным шрифтом: Qinyuanchun · Changsha-Mao Zedong

Подчеркнуть: Qinyuanchun · Changsha-Mao Zedong

Italic Bold подчеркивается: Qinyuanchun · Changsha-mao Zedong

</body>

</html>

Введите http: //localhost/font_style.htm в адресной строке браузера, и эффект просмотра показан на рисунке 4.10.

Рисунок 4.10 Настройки модификации шрифтов

Автор устанавливает все размеры текста в <body> </body> на № 5 для просмотра читателей.

- Примечание: когда несколько тегов содержат один и тот же кусок текста, их порядок включения не может быть смещен.

4.2.8 Использование нескольких стилей заголовков

В веб -статьях, чтобы подчеркнуть важность названия, стиль названия относительно особенный. Технология HTML защищает набор тегов стиля для названий, а именно двойные теги <h1> до <h6>, а размеры текста представляют различные уровни названий от больших до малых. Тег заголовка имеет функцию, которая является исключительной для одной строки, жирной в тексте и в центре в тексте. Таким образом, легко установить заголовок и может установить многоуровневые названия. Создайте файл веб -страницы в каталоге D:/ Web/ с именем FONT_H.HTM и напишите код, как показано в коде 4.11.

Код 4.11 Настройки заголовка: font_h.htm

<html>

<голова>

<title> Настройки заголовка </title>

</head>

<тело>

<h1> заголовок № 1 </h1>

<h2> Название № 2 </h2>

<h3> Название № 3 </h3>

<h4> Название № 4 </h4>

<h5> Название № 5 </h5>

<h6> Название № 6 </h6>

<h1> Журнал Fortune: Почему Google не падает после его процветания? </h1>

<h3> Столкнув потенциальные проблемы </h3>

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

<h3> продолжит монополизировать поиск </h3>

& nbsp; & nbsp; & nbsp; & nbsp; Недавние статьи говорится, что если появятся лучшие поисковые системы, люди без колебаний откажутся от Google. Но даже если есть действительно лучшие поисковые системы, Google может некоторое время стоять на некоторое время. ... В этом случае скорость веб -сайта часто становится ключом к результату.

</body>

</html>

Введите http: //localhost/font_h.htm в адресной строке браузера, и эффект просмотра показан на рисунке 4.11.

Рисунок 4.11 Настройки заголовка

4.2.9 Научитесь обращаться с особыми персонажами на веб -страницах

В HTML некоторые символы имеют особые значения, такие как <и>, являются левыми и близкими скобками тега, в то время как тег управляет отображением HTML. Сама тег может быть проанализирован только с помощью браузера и не может отображаться на странице. Итак, как отобразить <и> в HTML? HTML указывает способ написать некоторые специальные символы, которые будут отображаться на веб -страницах, как показано в таблице 4.1.

Таблица 4.1 Специальные символы в HTML

Специальные символы

HTML -код

Специальные символы

HTML -код

& lt;

™ (символ товарного знака)

&торговля;

& gt;

® (Символ регистрации)

& Reg;

(Полугодия на английском языке)

& quot;

и времена;

& секта;

& копировать;

Создайте файл веб -страницы в D:/ Web/ Directory, с именем string.htm и напишите код string.htm, как показано в коде 4.12.

Код 4.12 Настройки специальных символов: string.htm

<html>

<голова>

<Tilt> Настройки специальных символов </title>

</head>

<тело>

Как отображать теги: & lt; html & gt;

Как отображать кавычки: «Английский полугодный цитаты»

Метод отображения товарных знаков: & trade;

Как отобразить символы регистрации: & reg;

Как отображать символы авторского права: & copy;

Show & sect;

Show & Times;

</body>

</html>

Введите http: //localhost/string.htm в адресной панели браузера, и эффект просмотра показан на рисунке 4.12.

Рисунок 4.12 Настройки специальных символов

- Описание: символы должны отображаться отдельно и должны использоваться с кодом & amp;.

4.2.10 Как более удобно игнорировать анализ браузеров некоторых HTML

Если вы сделаете пример кода HTML, похожий на эту книгу на веб -странице, вам, возможно, придется конвертировать все <и> в & lt; И это будет казаться более хлопотным. <plailText> и <xmp> </xmp> в коде HTML могут легко решить эту проблему.

<plailText> это единственный тег. Когда он вставлен в HTML -код, все теги HTML после его недействительного. То есть браузер не анализирует все теги HTML после <plaintext> и отображает их непосредственно на странице.

<xmp> </xmp> - двойной тег, который лишь недействительный теги в содержании, который он содержит, и использование <xmp> </xmp> более распространено. Создайте файл веб -страницы в каталоге D:/ Web/ с именем html.htm и напишите код, как показано в коде 4.13.

Код 4.13 Игнорируйте настройки тегов: html.htm

<html>

<голова>

<Title> Игнорируйте настройки тегов </title>

</head>

<тело>

<h2> Qinyuanchun · Changsha </h2>

<xmp> Независимо от холодной осени, идите к северу от реки Сянцзян , главы Оранжевого острова. Посмотрите на красные горы, и леса окрашены; Река зеленая и чистая, а сотни лодок конкурируют за ток. </xmp>

Орлы ударяют по небу, рыба плавает на мелководье, и все виды видов конкурируют за свободу в небе. Когда мне грустно из -за огромной земли, кто отвечает за взлеты и падения?

Я принес сотни пар в путешествие, и я вспомнил прошлые славные годы. одноклассники молоды, в расцвете сил; Ученый полон энтузиазма и мужества. Расскажите стране и вдохновляет слова, навоз за грязь тогда составлял десять тысяч домохозяйств. Вы когда -нибудь вспомнили, что когда вы попадаете в воду посередине, волны перестанут летать на лодках!

</body>

</html>

Введите http: //localhost/string.htm в адресной панели браузера, и эффект просмотра показан на рисунке 4.13.

Рисунок 4.13 Игнорируйте настройки тегов

4.2.11 Другие методы изменения текста

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

- Тег формата SuperScript - это двойная тега , который в основном используется для представления математических показателей, таких как квадратный или кубический метр определенного числа.

- Метка формата индекса - двойная метка , которая в основном используется для аннотации и математического основного представления.

-Митч на средней оценке-двойная метка <strike> </strike>, которая в основном используется для эффектов удаления.

Создайте файл веб -страницы в каталоге d:/ web/ with с именем ower.htm и напишите код, как показано в коде 4.14.

Код 4.14 Другие настройки тега модификации: другие.htm

<html>

<голова>

<TILE> Другие настройки для изменения тегов </title>

</head>

<тело>

Qinyuanchun Changsha !

Представление математического индекса: 2 3 = 8, 100 2 = 10000 <HR />

Qinyuanchun Changsha !

Представление математических основных чисел: log 3 81 = 4, log 5 125 = 3 <hr />

Эффект удаления: <strike> Я был удален </strike>

</body>

</html>

Введите http: //localhost/other.htm в адресной панели браузера, и эффект просмотра показан на рисунке 4.14.

Рисунок 4.14 Настройки других тегов модификации