12-01-2021, 20:12

Урок №2. Заголовки, абзацы, работа со шрифтами

Учим теги абзацев и заголовков. Учимся подчеркивать текст, делать его жирным и курсивным. Узнаем как зачеркнуть написанные слова, поместить их снизу или сверху строки.

Если вы сделали задание с прошлого урока, у вас должно было получиться что-то вроде этого:

Создаем сайт Но, когда вы сохранили свою страничку под именем index1.html, а затем её открыли, получилось вот так:

сайт

Совсем не так как планировалось!!!

А почему?

Да всё просто. Вы не указали с помощью тегов, как должен выглядеть текст на экране.

Вот браузер и вывел всё подряд.

Тег абзаца <p>

Абзац - небольшой фрагмент текста, состоящий из одного или нескольких предложений, начинающийся с новой строки.

Для того, чтобы написать кусочек текста с новой строки, его нужно взять в теги <p> </p>.

Вот как нужно было написать рассказ о себе:

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

Но можно еще внести кое-какие изменения.

Теги работы со шрифтом

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

<b> ЖИРНЫЙ ТЕКСТ </b>

Для того, чтобы подчекнуть слово, его нужно взять в тег <u></u>.

<u> ПОДЧЕРКНУТЫЙ ТЕКСТ </u>

Для того, чтобы сделать текст наклонным (курсивным), его надо взять в теги <i></i>.

<i> КУРСИВНЫЙ ТЕКСТ </i>

Для того, чтобы зачеркнуть текст, его надо взять в теги <s></s>.

<s> ~~ЗАЧЕРКНУТЫЙ ТЕКСТ~~ </s>

Для того, чтобы написать текст сверху строки (верхний индекс), надо его взять в теги <sup></sup>.

<sup> ^{ВЕРХНИЙ ИНДЕКС} </sup>

Для того, чтобы написать текст снизу строки (нижний индекс), надо его взять в теги <sub></sub>.

<sub> _{НИЖНИЙ ИНДЕКС} </sub>

Используя эти теги, уже можно несколько разнообразить текст на веб-страничке.

Если у вас установлен на компьютере Microsoft Office, можно открыть текстовый редактор Word и написать текст в нем. (Если же не установлен, можно купить office 2019 пройдя по ссылке). Там же раскрасить слова, разместить их в нужно порядке, отформатировать по своему усмотрению. А при сохранении указать, что вы сохраняете документ в виде Веб-страницы.

Теги заголовков

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

Поэтому в языке HTML есть специальные теги и для заголовков.

Их целых 6. Отличаются заголовки по величине букв.

Заголовок, заданный тегом <h1></h1> имеет самый большой размер букв.

Следом идет тег <h2>, потом <h3>... И так далее до <h6>.

Всё! Тега <h7> не существует.

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

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

Задание для самостоятельной работы

Внесите изменения в вашу страничку с рассказом о себе.

Добавьте абзацы, заголовки.

Выделите важные слова жирным или курсивным начертанием.

Уважаемые читатели!

Все материалы с сайта можно скачивать абсолютно бесплатно. Все материалы проверены антивирусом и не содержат скрытых скриптов.

Материалы в архиве не помечены водяными знаками!

Если материал нарушает чьи-то авторские права, просьба написать нам по обратной связи, указав авторство материала. Мы обязуемся либо убрать материал, либо указать прямую ссылку на автора.

Сайт пополняется материалами на основе бесплатной работы авторов. Eсли вы хотите отблагодарить их за работу и поддержать наш проект, вы можете перевести любую, не обременительную для вас сумму на счет сайта.
Заранее Вам спасибо!!!

К списку новостей