Электронный учебник
Учебное пособие
4. Текст
1.Выделение текста жирным начертанием

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

Итак, чтобы просто выделить текст жирным, мы можем воспользоваться тегом <b>.

Данный тег относится к элементам физической разметки, при этом устанавливая жирное начертание текста, не делая на нем какого-либо акцента. Этот тег является парным, что говорит о том, что он имеет, как открывающий тег, так и закрывающий. Кроме того, так как элемент встроенный, он должен находиться в каком-либо блочном элементе, например <p>.

2.Выделение текста

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

Чтобы выделить текст курсивом мы воспользуемся тегом<i>. Этот элемент является парным и строчным, что говорит нам о том, что мы должны использовать, как открывающий тег так и закрывающий. А также должны использовать его внутри блочного элемента. И в данном случае наиболее подходящий блочный элемент — тег параграфа <p>

Так же есть теги которые выполняют аналогичную работу в HTML кодах, такие как :

<strong> - жирный
<em> - курсив
Вы уже изучили заголовки в HTML страницах, и знаете, что стиль прописного заголовка, даёт системе понять какого размера будет тот или иной текст, но, это можно сделать и без помощи заголовков, а всего лишь указав, нужный тег.
<big> - большой
<small> - маленький
Так же в HTML можно выставлять степень или индекс, для этого существуют теги такие как:
<sub> - нижняя степень
<sup> - верхняя степень (индекс)
В HTML существует тег <pre>, он даёт системе понять, что никакого редактирования с текстом производит не нужно, а нужно сохранить текст таким, каким он задан изначально.
Практическое задание 1
<html>
<body>
<p>
Если необходимо чтобы к тексту было применено какое-либо
форматирование, например, выделение <b>полужирным</b>
или <i>курсивом</i>, необходимо использовать
соответствующие теги форматирования.
При этом форматируемый текст помещается между тегами.
</p>
</body>
</html>
Сохраните файл под именем 12 b/I.html

Практическое задание 2
<html>
<body>
<p><strong>Данный параграф отформатирован тегом strong</strong></p>
<p><b>А этот тегом b, внешне они не отличаются.</b></p>
<p><em>Данный параграф отформатирован тегом em</em></p>
<p><i>А этот тегом i, внешне они не отличаются.</i></p>
</body>
</html>

Сохраните файл под именем 13strong.html

Практическое задание 3
<html>
<body>
<p><big>Данный параграф отформатирован тегом big </big></p>
<p><small>Данный параграф отформатирован тегом small </small></p>
<p>А в данном параграфе теги не применяются</p>
</body>
</html>

Сохраните файл под именем 14 big/small.html

Практическое задание 4
<html>
<body>
<p>Формула воды H2O. В данном параграфе формула набрана
без использования тега sub</p>
<p>Формула воды H<sub>2</sub>O. В данном параграфе формула набрана с использованием тега sub Формула выглядит более привычно.</p>
<p>2^4=16. В данном параграфе формула набрана без использования тега sup</p>
<p>2<sup>4</sup>=16. В данном параграфе формула набрана с использованием тега sup. Формула выглядит более привычно.</p>
</body>
</html>

Сохраните файл под именем 15 index/stepen.html

Практическое задание 5
<html>
<body>
<pre>
Это
предварительно форматированный текст.
Он сохраняет как пробелы,
так и переносы строк.
</pre>
</body>
</html>

Сохраните файл под именем 16 pre.html


Практическое задание 6
<html>
<body>
<pre>
// Данный фрагмент набран с использованием тега pre
for (int i = 1; i < 10; i++)
{
printf ("i=%i\n", i);
}
</pre>

<p> // Здесь тег pre не применялся
for (int i = 1; i < 10; i++)
{
printf ("i=%i\n", i);
}
</p>

</body>
</html>
Сохраните файл под именем 17 pre.html