Мастерство в использовании HTML Нижнего индекса текста

Введение

В HTML тег <sub> используется для указания встроенного текста, который должен быть отображен в виде нижнего индекса только по типографическим причинам. Содержимое этого тега обычно отображается с пониженной базовой линией и меньшим размером шрифта. В этом практическом занятии вы научитесь использовать тег <sub> в HTML для отображения текста с нижним индексом.

Примечание: Вы можете практиковать программирование в index.html и изучить Как писать HTML в Visual Studio Code. Нажмите кнопку "Запустить в браузере" в нижнем правом углу, чтобы запустить веб-сервис на порту 8080. Затем можно обновить вкладку Web 8080, чтобы просмотреть веб-страницу.

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL html(("HTML")) -.-> html/BasicStructureGroup(["Basic Structure"]) html(("HTML")) -.-> html/LayoutandSectioningGroup(["Layout and Sectioning"]) html(("HTML")) -.-> html/AdvancedElementsGroup(["Advanced Elements"]) html/BasicStructureGroup -.-> html/basic_elems("Basic Elements") html/BasicStructureGroup -.-> html/head_elems("Head Elements") html/LayoutandSectioningGroup -.-> html/doc_flow("Document Flow Understanding") html/AdvancedElementsGroup -.-> html/inter_elems("Interactive and Dynamic Elements") subgraph Lab Skills html/basic_elems -.-> lab-70847{{"HTML Нижний индекс текста"}} html/head_elems -.-> lab-70847{{"HTML Нижний индекс текста"}} html/doc_flow -.-> lab-70847{{"HTML Нижний индекс текста"}} html/inter_elems -.-> lab-70847{{"HTML Нижний индекс текста"}} end

Добавьте HTML-шаблон

Создайте новый файл с именем index.html.

Добавьте следующий код в index.html, чтобы создать базовую структуру HTML.

<!doctype html>
<html>
  <head>
    <title>HTML Sub Tag Lab</title>
  </head>
  <body></body>
</html>

Добавьте тег нижнего индекса

Добавьте следующий код внутри элемента <body>, чтобы создать текст с нижним индексом.

<p>My chemical formula is H<sub>2</sub>O.</p>

Этот код будет отображать текст "My chemical formula is H2O", где "2" будет отображаться в виде нижнего индекса.

Сохраните файл index.html и откройте его в веб-браузере, чтобы просмотреть результат. Вы должны увидеть текст с нижним индексом "H2O".

Резюме

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