ВУЗ: Не указан
Категория: Не указан
Дисциплина: Не указана
Добавлен: 04.12.2019
Просмотров: 607
Скачиваний: 4
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
DOCTYPE для HTML 5
В отличие от предыдущих версий тег всего один
<!DOCTYPE html>
Основные элементы («
Теги и их параметры нечувствительны к регистру. То есть <A HREF="http://yahoo.com"> и <a
href="http://yahoo.com"> означают одно и то же.
В последних версиях HTML практически у каждого тега огромное число необязательных
параметров — обычно не меньше 15. Мы приводим только основные параметры тегов.
Гиперссылки
<A HREF="filename" target="_self">название ссылки</A>
Атрибут
HREF
задает значение адреса документа, на который указывает ссылка.
filename
— имя файла или адрес Internet, на который необходимо сослаться.
название ссылки
— название гипертекстовой ссылки, которое будет отображаться в
браузере, то есть показываться тем, кто зашел на страницу.
TARGET
— задает значение окна или фрейма, в котором будет открыт документ, на
который указывает ссылка. Возможные значения атрибута:
o
_top
— открытие документа в текущем окне;
o
_blank
— открытие документа в новом окне;
o
_self
— открытие документа в текущем фрейме;
o
_parent
— открытие документа в родительском фрейме.
Значение по умолчанию: _self.
Текстовые блоки
<H1> … </H1>
,
<H2> … </H2>
, … ,
<H6> … </H6>
— заголовки 1, 2, … 6 уровня.
Используются для выделения частей текста (заголовок 1 — самый большой, 6 —
почти равен обычном тексту по умолчанию).
<P>
— новый абзац. Можно в конце абзаца поставить
</P>
, но это не обязательно.
<BR>
— новая строка. Этот тег не закрывается (то есть не существует тега
</BR>
)
<HR>
— горизонтальная линия
<BLOCKQUOTE> … </BLOCKQUOTE>
— цитата. Обычно текст сдвигается вправо.
<PRE> … </PRE>
— режим preview. В этом режиме текст заключается в рамку и никак
не форматируется (то есть теги, кроме </PRE>, игнорируются, и переводы строки
ставятся там, и только там, где они есть в оригинальном документе).
<DIV> … </DIV>
— блок (обычно используется для применения стилей
<SPAN> … </SPAN>
Форматирование текста
<EM> … </EM>
— логическое ударение (обычно отображается
курсивным шрифтом
)
<STRONG> … </STRONG>
— усиленное логическое ударение (обычно отображается
жирным шрифтом
)
<I> … </I>
— выделение текста
курсивом
<B> … </B>
— выделение текста
жирным шрифтом
<U> … </U>
— подчѐркивание текста
<S> … </S>
— зачѐркивание текста. Вот так: зачѐркнутый текст.
<STRIKE> … </STRIKE>
— то же самое, что
<S> … </S>
<BIG> … </BIG>
—
увеличение шрифта
<SMALL> … </SMALL>
—
уменьшение шрифта
<BLINK> … </BLINK>
— мигающий текст. Внимание! Этот тег может не работать в
версий 5 и ниже без применения
<MARQUEE> … </MARQUEE>
— сдвигающийся по экрану текст.
<SUB> … </SUB>
— подстрочный текст. Например, H
<SUB>2</SUB>O
создаст текст
H
2
O.
<SUP> … </SUP>
— надстрочный текст. Например, E=mc
<SUP>2</SUP>
создаст текст
E=mc
2
.
<FONT
параметры
> … </FONT>
— задание параметров шрифта. У этого тега есть
следующие параметры:
o
COLOR=
color
— задание цвета. Цвет может быть задан в шестнадцатеричной
форме как #rrggbb (первые 2 шестнадцатеричные цифры задают красную
компоненту, следующие 2 — зелѐную, последние 2 — синюю) или названием.
o
FACE=
шрифт
меняет шрифт
o
SIZE=
размер
меняет размер шрифта. Размер от 1 до 7, стандартный по
умолчанию 3. (Есть много способов изменить стандартный размер для данной
страницы.)
o
SIZE=+
размер
или SIZE=-
размер
— размер задаѐтся по сравнению со
стандартным. Например, +2 означает размер на 2 больше стандартного.
Так, например,
Сигналом к началу атаки являются
<U>три</U> <FONT SIZE="+2">больших</FONT> <FONT COLOR="green">зелѐных</FONT>
свистка.
создаст текст
Сигналом к началу атаки являются три
больших
зелѐных
свистка.
Списки
<UL>
<LI> первый элемент </LI>
<LI> второй элемент </LI>
<LI> третий элемент </LI>
</UL>
создаѐт список
первый элемент
второй элемент
третий элемент
Если вместо
<UL>
(Unordered List, что означает ненумерованный список) поставить
<OL>
(Ordered List, нумерованный список), список получится нумерованным:
1.
первый элемент
2.
второй элемент
3.
третий элемент
У этих тегов есть параметры:
«type»="тип"
где
тип
— форма цифр или букв (может быть в ul -
1.
square — квадрат
2.
round — пустой круг
3.
disk — полный круг, по умолчанию,
а в ol -
1.
«A» или «а» (латинскими буквами) — Буквенный список, соответственно заглавными
или обычными буквами.
2.
«I» или «i» — Римские цифры
3.
«1» — арабские цифры
пишется так:
<ol type="i">
<li> Первое </li>
<li> Второе </li>
<li> И т.д. </li>
</ol>
, параметр «start» (для <ol), определяющий начало нового отсчета, например, не 1, 2, 3, а 14,
15, 16
Пишется так:
<ol start="24">
<li> Двадцать четыре </li>
<li> Двадцать пять </li>
<li> И т.д. </li>
и, наконец для тега <li параметр «value» - если необходимо перескочить с одной цифры на
другую, например, не 1, 2, 3, а 1, 2, 4, 5, и т.д.
<ol>
<li> Один </li>
<li> Два </li>
<li value="22"> Двадцать два </li>
<li> Двадцать три </li>
.
Наконец, третьим, и последним, списком, является
список определений
:
<DL>
<DT> Кошка </DT> <DD> мяукающее домашнее животное </DD>
<DT> Кот </DT> <DD> муж кошки </DD>
<DT> Крокодил </DT> <DD> большой африканский зверь с острыми зубами </DD>
</DL>
создаст следующее:
Кошка
мяукающее домашнее животное
Кот
муж кошки
Крокодил
большой африканский зверь с острыми зубами
Между прочим, теги <LI>, <DT>, <DD> можно и не закрывать.
Объекты
EMBED
— вставка различных объектов: не-HTML документов и media-файлов
APPLET
— вставка
SCRIPT
— вставка скриптов.
Изображения
IMG
— вставка изображения. Этот тег не закрывается.
o
SRC
— имя или URL
o
ALT
— альтернативное имя (отобразится, если в браузере запретить
отображать картинки)
o
TITLE
— краткое описание изображения (отобразится при наведении курсора
на картинку)
o
WIDTH, HEIGHT
— размеры (если не совпадают с истинными размерами
картинки, то изображение «растянется»/«сожмется»)
o
ALIGN
— задает параметры обтекания текстом (top, middle, bottom, left, right)
o
VSPACE, HSPACE
— задают размеры вертикального и горизонтального
пространства вокруг изображения
Пример:
<IMG SRC=url ALT="текст" TITLE="текст" WIDTH="размер (пикс, %)" HEIGHT="размер
(пикс, %)">
Изображение можно сделать ссылкой:
<A HREF=url ><IMG SRC=url></A>
Таблицы
TABLE
— создание таблицы. Параметры тега:
o
BORDER
— толщина разделительных линий в таблице
o
CELLSPACING
— расстояние между клетками
CAPTION
— заголовок таблицы (этот тег необязателен)
TR
— строка таблицы
TH
— заголовок столбца таблицы (этот тег необязателен)
TD
— ячейка таблицы
height
— высота таблицы
width
— ширина таблицы
Так, например,
<TABLE BORDER="1" CELLSPACING="0">
<CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
<TH> Год </TH>
<TH> Улов </TH>
<TR>
<TD> 1997 </TD>
<TD> 214 </TD>
</TR>
<TR>
<TD> 1998 </TD>
<TD> 216 </TD>
</TR>
<TR>
<TD> 1999 </TD>
<TD> 207 </TD>
</TR>
</TABLE>
Создаст таблицу:
Улов крокодилов в Мумбе-Юмбе
Год
Улов
1997
214
1998
216
1999
207
У тега TABLE есть ещѐ параметр CELLPADDING. Он определяет расстояние в пикселях
между рамкой ячейки и еѐ содержимым. Например, если заменить первую строку таблицы на
<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5">
таблица получится такой: