Для оформления текста в HTML используются следующие HTML элементы:
| Назначение | Пример | Результат |
|---|---|---|
| Перенос строки | Строка 1<br>Строка 2 | Строка 1 Строка 2 |
| Строка | <span>Текст</span> | Текст |
| Блок занимающий всё горизонтальное место | <div>Текст</div> | Текст |
| Заголовки (от самого большого h1 до самого маленького h6) | <h1>Текст</h1> | Текст |
| Жирный текст | <b>Текст</b> | Текст |
| Наклонный текст | <i>Текст</i> | Текст |
| Подчёркнутый текст | <u>Текст</u> | Текст |
| Перечёркнутый текст | <s>Текст</s> | |
| Важный текст | <strong>Текст</strong> | Текст |
| Акцент на тексте | <em>Текст</em> | Текст |
| Надстрочный индекс | A<sup>i</sup> | Ai |
| Подстрочный индекс | A<sub>i</sub> | Ai |
| Код на языке программирования | <code>Текст</code> | Текст |
| Название клавиши клавиатуры | <kbd>Shift</kbd> | Shift |
| Название объекта (например, сайта), на который ссылаются | <cite>Текст</cite> | Текст |
| Цитируемая строка из другого источника | <q>Текст</q> | Текст |
| Цитируемый блок из другого источника | <blockquote> Текст </blockquote> |
|
| Параграф | <p>Текст</p> | Текст |
| Редакторская вставка в документ | <ins>Текст</ins> | Текст |
| Редакторское удаление из документа | <del>Текст</del> |
Пример веб-страницы с оформлением текста
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>Оформление текста</title> </head> <body> <blockquote> Мороз и солнце; день чудесный!<br> Еще ты дремлешь, друг прелестный —<br> Пора, красавица, проснись:<br> Открой сомкнуты негой взоры<br> Навстречу северной Авроры,<br> Звездою севера явись!<br> </blockquote> <p> Александр Пушкин <cite>Зимнее утро</cite> </p> <h1>Заголовок</h1> <p>Параграф 1</p> <p> Параграф 2 <br> <b>Жирный текст</b> <i>Наклонный текст</i> <br> A<sup>2</sup> = A * A <br> Нажмите клавишу <kbd>F1</kbd> <br> <ins>Вставленная фраза</ins> <del>Удалённая фраза</del> </p> </body> </html> |
Эта веб-страница, открытая в веб-браузере:
Прекрасный пост! Информация изложена ясно и
доступно. Особенно понравилась организация материала – только важное, никакой лишней
информации. Непременно порекомендую приятелям.