Редактирование текста с помощью HTML
В этом уроке будут рассмотрены основные теги языка HTML, которые необходимы для красивого оформления текста.
В однообразном контенте сложно ориентироваться, поэтому и выделяются заголовки, привлекается внимание к основным тезисам с помощью подчеркивания или курсива.
Итак, давайте разнообразим текст! Как? Начнем с рис.1.
В данном примере текст уже несколько отформатирован. Итак, мы видим заголовок первого уровня - парный тег
<h1></h1>
. Всего заголовков шесть. Различаются они только соответствующей цифрой в названии тега. Кроме того, представленный атрибут тега <body>
, - text
, позволяет задавать цвет отображаемого текста. Многие из Вас так или иначе пользовались Word'ом, какие основные возможности по редактированию текста он предоставляет? Вспомним и приведем альтернативы для HTML (рис.2).
Итак, начнем с курсива, - он задается с помощью тега
<i></i>
. Что есть еще? Полужирное начертание! Задается либо тегом
<b></b>
, либо <b></b>
. Заметьте, что все строки отделяются при помощи одиночного тега перевода текста на новую строку
<br>
. Без него текст будет предоставляться пользователю браузера последовательно, сколько бы раз Вы не нажали Enter в редакторе. Подчеркивание текста выполняется при помощи тега
<u></u>
, а его зачеркивание - через <s></s>
, тот же эффект достигается и через тег <strike></strike>
. Но <s>
все-таки покороче. Разумеется, к одной фразе можно применять и сразу несколько тегов форматирования, есть только одно правило - последний открытый тег закрывается первым и так по очереди до первого. Не путайте последовательность, потому что, даже если фрагмент и отформатируется, то скорее всего с ошибками.
Отформатировать отдельный фрагмент текста можно, заключив его в тег
<font></font>
. У него есть три интересных атрибута. Во-первых,
- size
, с его помощью можно задать размер шрифта. Далее -
color
. Вообще-то, цвет задается посредством шестнадцатеричного кода, но в отдельных случаях можно задавать параметр английском словом (red, green, yellow, blue, azure и т.д.). Значения face задают так называемую гарнитуру шрифта, это всем известные - Arial, Times New Roman и т.д. Таких значений может быть несколько, вводятся они через запятую. Зачем использовать больше одного параметра? Все просто, - это делается потому, что если первая гарнитура будет отсутствовать в браузере пользователя, то для отображения будет использована следующая и так далее.
Если Вам хочется, чтобы текст предоставлялся в виде так называемого моноширинного шрифта, то используйте тег
<tt></tt>
. Ну и основное, что понадобится Вам при форматировании большого объема текста, - выделение абзацев при помощи
<p></p>
. Ну что ж, теперь Вы знаете основные теги для редактирования текста, - пора применять на практике. Заходите по чаще на fotoredactor.com Удачи!
Дата публикации: 30-05-2022, 19:40 «|»
Просмотров: 95 «|»
Автор статьи: Фотограф
Похожее:
Комментарии:
Новинки
Цветной фрагмент на черно-белом снимке
В рамках этого небольшого урока объясняется, как в Photoshop сделать черно-белую фотографию с яркой...
Урок Photoshop - Огненная живопись
Статья представляет собой урок по созданию красивых «огненных» рисунков в Photoshop, а также...
Как сделать в фотошопе голограмму
Урок, который поможет создать нечто интересное. В статье-инструкции рассказывается о том, как в...
Создание иллюзии стремительного движения в Photoshop
Этот урок несет в себе не только информативность, он способен разрядить обстановку, переключить...
Создание слайд-шоу фото и картинок
Как запускать слайд-шоу фотографий и картинок на компьютере с помощью функционала известной...
Новинки
Movavi Video Editor Plus (Полная версия 22.2.1)
Хороший видеоредактор, главное не сложный в управлении...
Adobe Photoshop Lightroom Classic CC 2022 (RUS|x32/x64) RePack & Portable
Для меня лучшего конвертера чем Lightroom пока не существует...
Adobe Photoshop CC 2022 (RUS) RePack & Portable
Подскажите по обработке файлов RAW, может плагин какой специальный надо поставить или я что то делаю...
Photodex ProShow Producer v.9.0.3 (RUS|x32/x64) RePack & Portable
Приятно удивило наличие интерфейса на русском языке, до этого пользовалась предыдущей версией, но та...
Adobe Dreamweaver CC 2021 (x86-x64|RUS/ENG)
Отличная программа, дримвивер мне очень нравится, все понятно в интерфейсе, удобно что он на русском...