Читайте также:
|
<тэг> </тэг> - не просто тэг, это контейнер, который может содержать внутри себя другие тэги (и текст).
Обратите внимание: <тэг1><тэг2><тэг3>... </тэг3></тэг2></тэг1>
Только такая очередность закрывающих тэгов верна: тэг, который мы открыли первым - закрываем последним, второй – предпоследним и т.д.
Т.е. следующая очередность нежелательна и не верна, она может привести к ошибкам на вашей страничке: <тэг1><тэг2><тэг3>... </тэг3></тэг1></тэг2>
Так что будьте внимательны, и пишите код своих страничек аккуратно и вдумчиво.
B. ЗАДАНИЕ на 1 занятие
Создайте HTML-документ со связным содержанием, в котором использованы все вышеперечисленные возможности. Тема содержания документа произвольная.
(Примерная форма документа приводится).
Основные критерии, которым должен соответствовать документ:
ü В заголовке HTML-документа должен быть заголовок документа;
ü Должен быть установлен цвет фона документа;
ü Должен быть установлен цвет текста документа;
ü В тексте документа должны быть не менее пяти абзацев, число слов не менее 100;
ü Должны быть использованы теги для перевода строки;
ü Должны присутствовать примеры выравнивания по левому, правому краям и по центру;
ü Должны присутствовать выделенные фрагменты текста с жирным шрифтом, курсивным шрифтом и шрифтом с подчеркиванием;
ü Должны присутствовать выделенные фрагменты текста с измененным цветом текста;
ü Должны присутствовать выделенные фрагменты текста с измененным размером текста.
C. ПОРЯДОК РАБОТЫ:
1. Создание рабочей папки.
Перед началом работы создайте на Вашем логическом диске (U:) отдельную папку для будущей страницы:
U:\первые шаги\
“Первые шаги” – это название папки, Вы можете назвать ее как угодно.
2. Создание html-документа.
Откроем текстовый редактор Блокнот (Пуск – Программы – Стандартные – Блокнот) и наберем там следующий текст:
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body>
Здравствуйте, это моя первая страница.
<br> 
Добро пожаловать!
</body>
</html>
3. Сохранение html-документа.
Сохраните этот документ в Вашей папке, присвоив файлу имя “index.html”:
U:\первые шаги\index.html
“index” – это название файла, Вы можете назвать его как угодно, расширение html – обязательно.
4. Открытие html-документа.
ü Откроем броузер – Internet Explorer (Блокнот не закрывайте, он нам еще пригодится), и откроем в броузере наш документ:
Файл - Открыть - кнопка Обзор – (Войти в свою папку и отметить свой документ index.html) – нажать кнопку «ОК»;
ü Откройте свою папку и сделайте двукратный щелчок по своему файлу index.html, при этом, как правило, по умолчанию html-файл открывается в Internet Explorer.
5. Просмотрите и проанализируйте получившийся html-документ, сопоставьте окончательный вид документа в браузере с исходным текстом документа в Блокноте.
ü Тэг <br> осуществляет перенос текста на другую строку, он не требуют закрывающего тэга.
ü Тэг <p> определяет начало нового абзаца, он также не требуют закрывающего тэга.
6. Редактирование html-документа.
Порядок редактирование html-документа:
ü Делаем активным текстовый редактор Блокнот с нужным документом;
ü Вносим необходимые изменения;
ü Сохраняем документ с внесенными изменениями;
ü Делаем активным Internet Explorer с тем же документом;
ü Нажимаем экранную кнопку «Обновить».
7. Измените документ. Посмотрите, что получится, если тэг <br> заменить тэгом <p>. Добавьте в документ свой текст, используя тэги <p> и <br>.
8. Тэги могут иметь атрибуты (свойства). Рассмотрим применение атрибутов на примере атрибутов тэга <body>.
9. Атрибут bgcolor тэга <body> определяет цвет фона документа:
<body bgcolor=#rrggbb>
rrggbb – это условное обозначение цвета, где rr, gg, bb –доли цветов красного (red), зеленого (green) и синего (blue) цветов, соответственно. Эти доли выражаются в шестнадцатиричной системе. Некоторые простые цвета можно также просто обозначить английскими словами: red, green, blue и т.д. Таблица основных 16 цветов приведена ниже в Приложении, более полный набор цветов (140) приведен в отдельном файле «Таблица цветов 140».
10. Измените цвет фона документа на оливковый, для этого добавьте в имеющийся тэг body следующий атрибут: <body bgcolor=#808000>. Посмотрите, что получится. Попробуйте установите цвет с помощью тектового обозначения цвета, например: <body bgcolor=Yellow>.
11. Атрибут text тэга <b<body text=#rrggbb ody> определяет цвет текста документа:
>.
12. Измените цвет текста документа, например, на белый:
<body bgcolor=Yellow text=white>
13. Подберите устраивающие Вас цвета фона и текста документа.
14. Атрибут align тега начала абзаца <p>, позволяет выровнять текст по центру, по левому или правому краю:
· <p align=left> – выравнивание по левому краю;
· <p align=right> – выравнивание по правому краю; <p align=center> – выравнивание по центру;
· <p align=justify> – выравнивание по левому и правому краю.
15. Для изменения начертания в отдельных фрагментах текста можно использовать следующие тэги:
·
· <b> жирный шрифт </b>
· <i> курсивный шрифт </i>
· <u> шрифт с подчеркиванием </u>
· <sub> подстрочный индекс </sub>
· <sup> надстрочный индекс </sup>
16. Для изменения цвета и размера текста в отдельных фрагментах можно использовать тэг:
<font color=#rrggbb size=nn face=Arial> фрагмент </font>:
– nn – размер шрифта, может принимать значение от 1 до 7.
– атрибут face устанавливает тип шрифта, в качестве примера указано Arial.
Дата добавления: 2015-10-02; просмотров: 54 | Нарушение авторских прав
| <== предыдущая страница | | | следующая страница ==> |
| Раздел HEAD | | | A. ЗАДАНИЕ на 2 занятие |