|
|
HTML - Уроки - Теги HTML
-
Голова документа <html>
<head>
<title>Название вашей страницы в строке
браузера</title>
</head>
<body>
Текст на
вашей страничке...
<br>
Добро пожаловать на мою страничку
</body>
</html>
Этот документ
можно создать с помощью блокнота (или вашего html редактора), потом
сохранить с расширением htm и открыть сохранённое с помощью вашего
браузера. Сохранив изменения в блокноте, просто нажимайте в вашем
браузере кнопку "обновить", чтобы увидеть изменения.
<head> </head> -
голова документа
<body> </body> - тело документа
|
- Глава
вторая
Изменение вида и цвета текста <font
color="#CC0000"> Изменение цвета</font>
<font
color="#669966"> Изменение цвета</font>
<font
color="#330099"> Изменение цвета</font>
Цвет кодируется
последовательностью из трех пар символов. Каждая пара представляет собой
шестнадцатеричное значение насыщенности заданного цвета одним из трех
основных цветов (красным, зеленым и синим) в диапазоне от нуля (00) до
255 (FF).
<b> Полужирный текст
</b>
<i> Наклонный текст (курсив) </i>
<u> Подчеркнутый текст </u>
<MARQUEE>
</MARQUEE>
<big>Увеличенный
шрифт</big>
<small>Уменьшенный
шрифт</small>
<sub>Нижний математ.
шрифт</sub>
<s>Зачеркнутый шрифт </s>
<acronym title="Текст подсказки">Подсказка</acronym>
|
- Глава
третья
Параграфы и заголовки
<br>
- перенос строки
Такая пара меток описывает абзац. Все, что
заключено между <P> и </P>, воспринимается как один абзац.
<p align="center">
Пример
выравнивания текстов с помощью параграфов по центру.
</p>
<p>
может содержать следующие выравнивания:
<p
align="center"></p> - по центру
<p
align="justify"></p> - по ширине
<p
align="left"></p> - по левой стороне документа
<p
align="right"></p> - по правой стороне документа
Заголовки Метки вида <Hi> (где i — цифра от 1 до
6) описывают заголовки шести различных уровней. Заголовок первого уровня
— самый крупный, шестого уровня, естественно — самый мелкий.
Пример
Заголовок 6-го
уровня
Заголовок 3-го
уровня
Заголовок 1-го
уровня
<font size="+3"> Еще один пример </font>
<font
size="-1"> Уменьшенный вариант </font>
|
|
- глава
пятая
Таблицы
В этой главе
раcсказаны не все возможности таблицы, а только самые необходимые(на мой
взгляд). Таблица начинается с метки <table> и
заканчивается меткой </table>. Метка <table> может включать
следующие атрибутов: align="center" align="left" align="right" -
выравнивание таблицы по центру, левому и правому краю документа.
width="50%" - ширина таблицы в процентах от ширины страницы.
width="50" - ширина таблицы в пикселях.
Border="2" - ширина
рамки таблицы. Если не указывать этот атрибут, таблица будет без рамки.
bgcolor="#ff9900" - цвет таблицы Каждая строка таблицы
начинается с метки <tr> и заканчивается меткой </tr>. Метка
<tr> может включать в себя атрибуты как и в <table>; align,
width, bgcolor. Каждая ячейка таблицы начинается с метки
<TD> и заканчивается меткой </TD>. Метка <TD> может
включать в себя следующие атрибуты: align, width, bgcolor. Если
ячейка таблицы пуста, вокруг неё не рисуется рамка. Если ячейка пуста, а
рамка нужна, в ячейку можно ввести символьный объект
(non-breaking space - не разрывающий пробел). Ячейка по-прежнему будет
пустой, а рамка вокруг неё будет. Пример простой таблицы
<table align="center" bgcolor="#e5e5e5" border="1"
width="300">
<tr>
<td width="150">ячейка 1-ой
строки</td>
<td width="150">2-ая ячейка 1-ой
строки</td>
</tr>
<tr>
<td width="150">ячейка 2
строки</td>
<td width="150"> </td>
</tr>
</table> В итоге получится
| ячейка 1-ой
строки |
2-ая ячейка
1-ой строки |
| ячейка 2
строки |
| Любопытно отметить, что любая ячейка таблицы может
содержать в себе другую таблицу.
|
- глава
шестая
Мета
теги
<META
HTTP-EQUIV="Expires" Content="Mon, 30 Mar 2002 11:50:01 GMT"> - Мета
тега для определения обновления браузера документа и замены его на новый
по дате. <META HTTP-EQUIV="Refresh" CONTENT="[время];
URL=[документ]"> Если пользователь не предпримет никаких видимых
действий в течение [время в секундах] после загрузки документа,
содержащего такую инструкцию, автоматически будет загружен [документ].
Очень полезно когда ваша страница была перемещена на другой адрес.
<META Name="autor" Content="Ваши Ф.И.О., E-Mail..."> - Для
указания дополнительной информации владельца страницы. <META
Name="copyright" Content="ваша фирма..."> - Для указания авторских
прав. <META HTTP-EQUIV="Content-Type" Content="text/html;
Charset=Windows-1251"> - Для определения написания на языке браузера.
<META Name="description" Content="Описание Вашей
Страницы"> - Для описания вашей страницы в поисковых мета-систем.
<META HTTP-EQUIV="Pragma" Content="no-cache"> -
Потрясающий мета тег не дающий никакой возможности вашему посетителю
просматривать вашу страничку в автономном режиме.
|
- глава
седьмая
Фреймы
<html>
<head>
<title>Название сайта в
строке браузера</title>
<frameset cols="100,*">
<frameset
rows="100,*">
<frame src="/logo">
<frame
src="/menu">
</frameset>
<frame src="/content">
</frameset>
</head>
</html> - Этот скрипт
фрейм вставляеться на главную страницу вашего сайта для последующего
отображения страницы <html>
<head>
<title>Название сайта в строке браузера</title>
<frameset
rows="100,*">
<frame src="/logo">
<frameset
cols="150,*">
<frame src="/menu">
<frame
src="/content">
</frameset>
</frameset>
</head>
</html> - Еще один пример фрейма
|
|
| |
-
Простейший пример вставки изображений. 