Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Часть 1 методичка HTML.doc
Скачиваний:
0
Добавлен:
01.07.2025
Размер:
430.59 Кб
Скачать
    1. Создание html – документа.

      1. На рабочем диске D: создайте свою папку.

      2. Запустите текстовый редактор Блокнот и наберите текст вашей первой Web- странички на основе приведенного ниже кода.

<HTML>

<HEAD>

<TITLE> Пример Web- странички </TITLE>

</HEAD>

<BODY>

Первая Web- страничка студента МГОУ Ф.И.О.

</BODY>

</HTML>

      1. Сохранение файла под именем mail.html (расширение html необязательно)

      2. Откройте документ в Internet Explorer. В окне браузера Вы должны получить следующий результат рис. 1.2

Рис. 1.2 Пример HTML – документа

В этом примере были использованы основные элементы структуры HTML – документа – контейнеры HTML, HEAD, TITLE, BODY.

Назначение этих элементов:

HTMLиспользуется для обозначения границ HTML – документа. Начальный тег <HTML> находится в самом начале документа, а конечный тег </HTML> является последним тегом кода и означает окончание всего документа

HEAD – заголовок HTML – документа. Элемент <HEAD> размещается сразу за тегом <HTML> и предшествует основной части Web- странички. Он содержит общую информацию про HTML – файл. В середине контейнера <HEAD> могут быть размещены любые другие элементы (например, TITLE).

TITLEобязательный элемент в области заголовка. Все то, что находится в контейнере <TITLE> интерпретируется браузером как название Web- странички и отображается в заголовке окна браузера.

BODY – тело документа. В нем размещена вся содержательная часть документа. Содержание элемента <BODY> отображается на экране согласно заданной пользователем HTML – разметке.

В приведенном выше примере основной текст документа, размещенный в контейнере <BODY>, представляет собой одну строчку.

Элемент <BODY> может иметь большое количество атрибутов, которые являются важными для определения общего вида документа.

Ниже приводится атрибуты элемента <BODY> и их назначения:

ALINK – Устанавливает цвета выделенной гиперссылки;

BACKGROUND – Указывает на url-адрес изображения-фона документа;

BGCOLOR – Устанавливает цвет фона документа;

LEFTMARGIN – Определяет ширину левого поля в пикселях;

LINK – Определяет цвет гиперссылки;

TEXT – Устанавливает цвет текста документа;

TOPMARGIN – Определяет ширину верхнего поля в пикселях;

VLINK – Определяет цвет гиперссылки, которая уже

использовалась.

      1. В текстовом редакторе Блокнот отредактируйте текс вашей Web- странички на основе приведенного ниже кода.

<HTML>

<HEAD>

<TITLE> Пример Web- странички </TITLE>

</HEAD>

<BODY BGCOLOR='YELLOW' TOPMARGIN=200 LEFTMARGIN=200 >

Первая Web- страничка студента МГОУ Ф.И.О.

</BODY>

<HTML>

      1. Сохраните html-файл на диске и откройте его в Internet Explorer.

При просмотре результата видно, что отображение текста значительно изменилось, благодаря заданий атрибутов отступа TOPMARGIN и LEFTMARGIN в 200 пикселей.

Использование атрибута BGCOLOR='YELLOW' задает желтый цвет фона документа.

В общем случае при просмотре Web-странички по умолчанию используются цвета, которые указаны в настраиваемых параметрах браузера. Разработчик может задать любым элементам документа свой цвет. Для упрощения процедуры задания цвета в HTML используется символический код, согласно которому каждому из 16 основных цветов присваивается имена:

ЦВЕТ Имя код

Черный - black - 000000

Бордовый - maroon - 800000

Зеленый - green - 008000

Оливковый - olive - 808000

Темно-синий - navy - 000080

Фиолетовый - purple - 800080

Электрик - teal - 008080

Серый - gray - 808080

Серебряный - silver - C0C0C0

Красный - red - FF0000

Лимонный - lime - 00FF00

Желтый - yellow - FFF00

Фуксия - fuchsia - FF0FF

Морская волна- aqua - 00FFF

Белый - white - FFFFFF

Так же цвета в HTML можно задавать с помощью 16-ричной системы кодирования. Например, следующие две строки идентичны (задают зеленый цвета фона):

<BODY BGCOLOR='GREEN'>

<BODY BGCOLOR='#008000'>