Создание заголовков разных уровней

Лабораторная работа №1 по HTML

Тема: Создание простой страницы и отображение в браузере.

Для того, чтобы отобразить HTML – документ, браузер принимает его из сети и выполняет команды встреченные в тегах (дескрипторах). Сами теги не отображаются в окне браузера, представляется только результат обработки HTML – документа.

HTML – документ может начинаться с тега <!DOCTYPE>, указывающего на версию языка HTML, с помощью которого написан данный документ.

Например, указание на 4-ю версию языка выглядит таким образом:

<!DOCTYPE HTML PUBLIC ”-//W3C//DTD HTML 4.0//EN”>

Создание заголовков разных уровней - student2.ru

Создание Web – страницы.

1) Загрузите текстовый редактор WordPad или Блокнот.

2) Установите режим Формат – Перенос по словам, чтобы текст страницы не выходил за пределы текущего окна.

3) Скопируйте исходный текст (без рамки) из лабораторной работы. Вставьте в окно документа Блокнот :

 
 
4) Введите <HTML> непосредственно над текстом и </HTML> непосредственно под текстом страницы. (Эти теги задают начало и конец страницы.) 5) Введите <HEAD> под дескриптором <HTML> 6) Дважды нажмите Enter 7) Наберите </HEAD> (Эти теги задают служебную часть страницы, не отображаемую в окне браузера). 8) Введите <TITLE> непосредственно под <HEAD> 9) Наберите текст названия (заголовка) Web – страницы (Брачные объявления) 10) Введите </TITLE>в конце заголовка. 11) Наберите <BODY> непосредственно под тегом </HEAD> 12) Введите </BODY> непосредственно над дескриптором </HTML> (В этих тегах задается основной текст страницы). 13) Сохраните полученный документ под именем index.html (или index.htm). 14) Обратите внимание на расстановку тегов в странице и запомните ее. 15) Откройте созданный файл с помощью браузера. Обратите внимание на разницу между исходным файлом и отображением в браузере. 16) Перейдите в окно редактора HTML (дальнейшие изменения в тексте HTML – страницы отобразятся в браузере по команде обновить – клавиша F5)  

Создание заголовков разных уровней - student2.ru

Создание заголовков разных уровней - student2.ru

Сохранение начального форматирования текста, пробелов и пустых строк.

1) Введите в тексте HTML – файла index.htm непосредственно под дескриптором <BODY> тег сохранения форматирования <PRE>

2) Введите непосредственно над дескриптором </BODY> тег </PRE>

3) Сохраните, просмотрите и проанализируйте результат в браузере.

Лабораторная работа №2 по HTML

Тема: Способы форматирования HTML - документов.

ü Каждое действие желательно просматривать в браузере, чтобы лучше понять работу тегов и атрибутов HTML

Создание заголовков разных уровней.

Тег <H?> задает полужирным шрифтом заголовки различных размеров, размещая их по центру. Вместо знака ? проставляется одно из значений размеров заголовка от 1 до 7

Задание 1:

1. Откройте ранее сохраненный файл index.html

2. Удалите теги сохранения форматирования <PRE> и </PRE> из текста.

3. Введите <H2> и </H2>непосредственно перед и после первого заголовка соответственно.

4. Введите <H3> и </H3>непосредственно перед и после второго заголовка.

5. Сохраните и проанализируйте полученный результат в браузере.

6. Уберите тег </H3> из текста документа. Как это отразилось в окне браузера.

7. Восстановите тег и сохраните документ.

Создание заголовков разных уровней - student2.ru 2. Создание абзаца (параграфа). Переход на новую строчку.

Тег <P> - задает разбивку текста на абзацы (параграфы). Имеет парный тег </P>, который задается при необходимости (каждый тег <p> добавляет пустую строку между абзацами).

Тег <BR> - задает разбивку текста на отдельные строки.

Задание 2:

1) Введите теги <P> и </P> в начале и в конце (желательно) каждого куплета стихотворения и автора.

2) Внутри куплетов перед каждой строчкой (кроме первых) введите тег <BR> .

3) Результат просмотрите в браузере.

4) Вставьте дополнительные пробелы между словами в заголовках (в первом – по одному, во втором – по три) командой &nbsp(дополнительный пробел). Результат просмотрите в браузере.

Создание заголовков разных уровней - student2.ru

Наши рекомендации