Файл: Лабораторная работа 9. Создание простейшего htmlдокумента. Формати рование шрифта и абзаца Цель работы.pdf

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
2
Вызвать меню броузера Вид/Просмотр HTML-кода и добавить после тек- ста «Приветствую Вас на моей первой web-страничке!» текст подписи:
Студент группы NNN Фамилия Имя
Сохранить документ (но не закрывать) и обновить его просмотр в бро- узере.
Используя одиночный тег
, отредактировать документ так, чтобы под- пись начиналась с новой строки, а Фамилия Имя – в следующей строке.
Просмотреть в броузере новый вариант.
Внимание! После каждого изменения документ нужно сохранять, а про-
смотр в броузере начинать с обновления загрузки документа с помощью кноп-
ки «Обновить» на панели инструментов.
4. Оформить фрагменты текста с помощью стилей Заголовков:
Первую строку документа оформить стилем Заголовок 1-го уровня с по- мощью парного тега

…

. Вторую строку оформить как Заголо-
вок 6-го уровня, а третью как Заголовок 4-го уровня.
Просмотреть документ в броузере, изменяя настройку отображения шриф- тов (меню Вид / Размер шрифта / Самый крупный, Средний, Мелкий и
Самый мелкий).
Поменять стиль оформления первой строки на Заголовок 2 уровня, второй строки - на Заголовок 5 уровня, последней строки - на Заголовок 3-го
уровня.
5. Выполнить форматирование шрифта:
После строки Фамилия Имя добавить еще одну строку текста
Нас утро встречает прохладой
Оформить фразу по приведенному ниже образцу.
В слове УТРО все буквы должны иметь разные цвета. В слове ПРОХЛАДОЙ оформить буквы ПРО – красным цветом, ОЙ – синим.
Оформить строку с подписью (Студент группы NNN Фамилия
Имя) курсивом, размер шрифта задать относительным изменением. Исполь- зовать теги и
Просмотреть полученный документ в броузере.
6. Выполнить форматирование абзацев:
Создать новый документ 2_name.htm, сохранить его в той же рабочей пап- ке.

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
3
Ввести текст (использовать копирование текста из документа 1_name.htm):



Приветствую Вас на моей второй web-страничке!
Монолог
Гамлета
Приветствую Вас на моей третьей web-страничке!

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
4

Дополнить текст документа (между тегами …

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
5
Таблица основных тегов HTML-документа. Теги форматирования шрифта и абзаца
Назначение
Вид тегов
Примечание
Общая структура документа HTML
Тип документа

Начало и конец документа
Имя документа
Не отображается броузером
Заголовок
Содержимое строки заголовка ок- на броузера
Тело документа

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
6
Уменьшенный размер
текст

^{Верхний индекс}


_{Нижний индекс}

Верхний индекс
^текст
Нижний индекс
_текст
Размер шрифта текст
?- значения от 1 до 7 или относи- тельное изменение (например, +2)
Базовый размер шрифта

Одиночный тег
? – размер от 1 до 7; по умолча- нию равен 3 и задается для всего документа в целом
Гарнитура шрифта
…»> текст
Текст оформляется первым, уста- новленным на компьютере шриф- том из списка названий
Цвет шрифта текст
Цвет задается либо ключевым словом, либо шестнадцатеричным кодом с символом #
RED –красный, #FF0000 – шест- надцатеричный код – красного цвета
Создание списков
Нумерованный

элементы списка

1. Элемент списка 1


2. Элемент списка 2


3. Элемент списка 3

Маркированный

элементы списка

Элемент списка

элементы списка

Таблица основных цветов
Цвет
Color's
name
Шестнадцатеричный код цве-
та
Red
Green
Blue
Черный black
00 00 00
Темно-синий navy
00 00 80
Голубой blue
00 00
FF
Зеленый green
00 80 00
Темно-зеленый teal
00 80 80
Салатный lime
00
FF
00
Бледно-голубой aqua
00
FF
FF
Вишневый maroon
80 00 00
Фиолетовый purple
80 00 80

Лабораторные работы по теме «Создание WEB-документов средствами языка разметки HTML»
7
Цвет
Color's
name
Шестнадцатеричный код цве-
та
Red
Green
Blue
Оливковый olive
80 80 00
Серый gray
80 80 80
Светло-серый silver
C0
C0
C0
Красный red
FF
00 00
Лиловый fushsia
FF
00
FF
Желтый yellow
FF
FF
00
Белый white
FF
FF
FF