HTML_000
.doc
Введение в HTML
Элемент - конструкция языка HTML. Это контейнер, содержащий данные и позволяющий отформатировать их определенным образом. Любая Web-страница представляет собой набор элементов.
Тэг- - стартовый или конечный маркеры элемента. Тэги определяют границы действия элементов и отделяют элементы друг от друга. В тексте теги заключаются в угловые скобки, а конечный тек всегода снабжается косой чертой.
Атрибут - параметр или свойство элемента. Это переменная, которая имеет стандартное имя и которой может присваиваться определенный набор значений: стандартных или произвольных. Предполагается, что символьные значения атрибутов заключаются в прямые кавычки, но некоторые броузеры позволяют не использовать кавычки. Атрибуты располагаются внутри стартового тега и отделяются друг от друга пробелами.
Гиперссылка - фрагмент текста, который является указателем на другой файл или объект. Необходимы для того, чтобы обеспечить возможность перехода от одного документа к другому.
Фрейм - область гипертекстового документа со своими полосами прокрутки.
HTML-файл или HTML-страница - документ, созданный в виде гипертекста на основе языка HTML. Такие файлы имеют расширение .htm или .html.
Апплет - программа, передаваемая на компьютер клиента в виде отдельного файла и запускаемая при просмотре страницы.
Скрипт - программа, включенная в состав Web -страницы для расширения ее возможностей.
CGI -общее название для программ, которые , работая на сервере, позволяют расширить возможности Web -страниц. Без таких программ невозможно создание интерактивных страниц.
Код - аналог понятия "текст программы"
World Wide Web , WWW, Web - всемирная паутина, распределенная система доступа к гипертекстовым документам, существующая в Inetnet. HTML является основным языком для создания документов в WWW.
Сайт - набор web-страниц, принадлежащих одному владельцу.
Броузер -программа для просмотра web-страниц.
URL (Uniform Resurs Locator) - универсальный указатель ресурса
тип_ресурса://хост.домен/имя_ресурса
тип_ресурса:
file news telnet wais
http gopher ftp ...
Указатель на локальную домашнюю страницу, расположенную в каталоге CAT на диске С:
file:///c:/cat/home.htm
Указатель на WEB-сервер ИТМО:
http://www.ifmo.ru
протокол HTTP (Hiper Text Transfer Protocol)
Структура документа
<html>
<head><title>имя окна</title></head>
<body>
текст документа с тэгами
</body>
</html>
Тэги форматирования текста
<hr> |
горизонтальная линия |
align="left" |
выравнивание |
|
|
center,right, justify |
|
|
|
size=.. |
толщина |
<p>...</p> |
абзац |
align="left" |
|
<br> |
конец строки |
center,right |
|
<nobr>...</nobr> |
запрет разрыва строки |
|
|
<pre>..</pre> |
внутри уже отформатированный текст |
|
|
<blockquote>..</blockquote> |
обозначение цитаты |
|
|
<center>..</center> |
центрирование текста |
|
|
<b>..</b> |
bold |
|
|
<i>..</i> |
italic |
|
|
<tt>..</tt> |
моноширинный шрифт |
|
|
<u>..</u> |
подчеркнутый |
|
|
<sub>..</sub> |
нижний индекс |
|
|
<sup>..</sur> |
верхний индекс |
|
|
<plaintext>.. </plaintext> |
конструкции html воспринимаются как текст |
|
|
<h1>..</h1> |
заголовок уровня 1 (6) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Списки
1. Ненумерованный <ul><li>...</ul>
<ul>
<li>Петров
<li>Иванов
<li>Сидоров
</ul>
2. Нумерованный <ol><li>...</ol>
<ol>
<li>Петров
<li>Иванов
<li>Сидоров
</ol>
атрибут tipe=
tipe="1" 1,2,3..
tipe="i" i,ii,iii,iv...
tipe="I" I, II, III, IV,...
tipe="a" a,b,c,d..
tipe="A" A,B,C,D,
3. Списки с определениями <dl> <dt><dd>.....</dl>
Пример
<dl>
<dt>Пункт 1
<dd>определение пункта 1
<dd>другое определение пункта 1
<dt>Пункт 2
<dd>определение пункта 2
</dl>
Цвет
аквамарин |
aqua |
#00FFFF |
белый |
white |
#FFFFFF |
желтый |
yellow |
#FFFF00 |
зеленый |
green |
#008000 |
каштановый |
maroon |
#800000 |
красный |
red |
#FF0000 |
оливковый |
olive |
#808000 |
пурпурный |
purple |
#800080 |
светло-зеленый |
lime |
#00FF00 |
серебристый |
silver |
#C0C0C0 |
серый |
gray |
#808080 |
сизый |
teal |
#008080 |
синий |
blue |
#0000FF |
ультрамарин |
navy |
#000080 |
фуксиновый |
fuchsia |
#FF00FF |
черный |
black |
#000000 |
Таблицы
пример 1
Петровым - 3 зв. |
<Table border=4
cellspacing=3
cellpadding=10 >
<tr><td bgcolor="yellow"> Петровым - 3 зв.
</Table>
пример 2
Заголовок 1 |
Заголовок2 |
|
ячейка2 |
ячейка1 |
ячейка3 |
|
ячейка4 |
ячейка5 |
<Table border=4
cellspacing=0
cellpadding=10 >
<tr> <td ><b> Заголовок 1</b>
<td ><b> Заголовок 2</b>
<tr> <td rowspan=3> ячейка1
<td > ячейка2
<tr> <td > ячейка3
<tr> <td > ячейка4
<tr> <td colspan=2 align="center"> ячейка5
</Table>
Вставка рисунка
<img src="имя_файла_рисунка">
атрибуты:
выравнивание:
align ="bottom" - по нижнему краю
="left" -
="middle" -центр
="right"
="top" - по верху
Размеры:
hight=высота в пикселях
width=ширина в пикселях
Рамка:
border=число писелов
Пустое пространство справа и слева:
hspace=число пикселов
Гиперссылки
1. Переход внутри текущего документа:
В документе должны быть расставлены метки:
<a name="метка1"> текст который помечается </a>
для перехода к этой метке:
...<a href="#метка1"> текст для щелчка </a>
2. Переход к другому документу:
...<a href="адрес ссылки"> текст для щелчка </a>
Если вместо текста для щелчка нужно поставить картинку, то:
...<a href="адрес ссылки"><img src="имя_файла_рисунка"></a>
Карта
пример 1
Есть картинка, условно размеченная следующим образом
<map name="карта1">
<area shape="circle" coords="119,114,20" href="имя_ссылки1">
<area shape="poly" coords="десять_чисел_через запятую" href="имя_ссылки2">
</map>
<img src="ссылка_на_рисунок" usemap="#карта1">
Фреймы
Задача: разбить экран на четыре окна, в каждое окно выводится свой файл *.htm:
<html>
<head>
<title>Фреймы</title>
</head>
<frameset rows="20%,60%,20%">
<frame src="3.htm" noresize>
<frameset cols="22%,78%">
<frame src="4.htm" >
<frame src="5.htm" name="left">
</frameset>
<frame src="6.htm" >
</frameset>
<noframes>Выкинь свой броузер! </Noframes>
</html>
noresize -нельзя двигать границу окна
name- имя окна - если в тэг ссылки добавлен атрибут target="left", то файл выводится в окно под именем left.
Важно: тэг <body> отсутствует!