WebClub - Всероссийский Клуб Веб-разработчиков
WebClub.RU » Архив » Краткое руководство по HTML

Краткое руководство по HTML


Дата публикации: 16-03-2013

ФОРМАТ ЭТОГО ДОКУМЕНТА

Для ясности, я поместил различные атрибуты которые могут появляться водном элементе на разные строки. В общем, несколько атрибутов могут быть использованы одновременно в одном элементе.

Элементы записаны в верхнем регистре для удобства чтения, большинство элементов воспринимаются в обеих регистрах.
УПОТРЕБЛЯЕМЫЕ СИМВОЛЫ

URL    URL (адрес) внешнего файла (или просто имя файла в том же каталоге) 
?      Любое число (т.е. <H?> значит <H1>, <H2>, <H3>, и т.д.) 
%      Любой процент (т.е. <hr align=left width="%>" значит <hr align=left width="50%>", и т.д.) 
***    Любой текст (т.е. ALT="***" значит заполните текст)     
$$$$$$ Любое 16ричное число (т.е. BGCOLOR="#$$$$$$" значит BGCOLOR="#00FF1C", и т.д.) 
,,,    Разделенное запятыми (т.е. COORDS=",,," значит COORDS="0,0,50,50", и т.д.) 
|      Альтернативы (т.е. ALIGN=LEFT|RIGHT|CENTER значит один из них) 

СОВМЕСТИМОСТЬ

(помните, HTML эволюционирует и просмотрщики бывают разные)

       (без отметки) Включено в HTML 3.2;  
           должно работать с последними версиями просмотрщиков  
N1.0   дополнение Netscape, введенное в Navigator'е версии 1.0 
N1.1   дополнение Netscape, введенное в Navigator'е версии 1.1 
N2.0   дополнение Netscape, введенное в Navigator'е версии 2.0  
N3.0b  дополнение Netscape, введенное в Navigator'е версии 3.0 бета 

БАЗИСНЫЕ ЭЛЕМЕНТЫ
      Тип документа     <HTML></HTML>     (начало и конец файла)
      Имя документа     <TITLE></TITLE>     (должно быть в заголовке)
      Заголовок     <HEAD></HEAD>     (описание документа, например его имя)
      Тело     <BODY></BODY>     (содержимое страницы)
ОПРЕДЕЛЕНИЕ СТРУКТУРЫ
      Заглавие     <H?></H?>     (стандарт определяет 6 уровней)
      с выравниванием     <H? ALIGN=LEFT|CENTER|RIGHT></H?>      
      Секция     <DIV></DIV>      
      с выравниванием     <DIV ALIGN=LEFT|RIGHT|CENTER></DIV>      
      Цитата     <BLOCKQUOTE></BLOCKQUOTE>     (обычно выделяется отступом)
      Выделение     <EM></EM>     (обычно изображается курсивом)
      Дополнительное выделение     <STRONG></STRONG>     (обычно изображается жирным шрифтом)
      Отсылка, цитата     <CITE></CITE>     (обычно курсив)
      Код     <CODE></CODE>     (для листингов кода)
      Пример вывода     <SAMP></SAMP>      
      Ввод с клавиатуры     <KBD></KBD>      
      Переменная     <VAR></VAR>      
      Определение     <DFN></DFN>     (часто не поддерживается)
      Адрес автора     <ADDRESS></ADDRESS>      
      Большой шрифт     <BIG></BIG>      
      Маленький шрифт     <SMALL></SMALL>      
ВНЕШНИЙ ВИД
      Жирный     <B></B>      
      Курсив     <I></I>      
N3.0b     Подчеркнутый     <U></U>     (часто не поддерживается)
      Перечеркнутый     <STRIKE></STRIKE>     (часто не поддерживается)
N3.0b     Перечеркнутый     <S></S>     (часто не поддерживается)
      Верхний индекс     <SUB></SUB>      
      Нижний индекс     <SUP></SUP>      
      Печатная машинка     <TT></TT>     (изображается как шрифт фиксированой ширины)
      Форматированый     <PRE></PRE>     (сохранить формат текста как есть)
      Ширина     <PRE WIDTH=?></PRE>     (в символах)
      Центрировать     <CENTER></CENTER> >     (как текст, так и графика)
N1.0     Мигающий     <BLINK></BLINK>     (наиболее осмеянный элемент)
      Размер шрифта     <FONT SIZE=?></FONT>     (от 1 до 7)
      Изменить размер шрифта     <FONT SIZE="+|-?"></FONT>      
N1.0     Базовый размер шрифта     <BASEFONT SIZE=?>     (от 1 до 7; по умолчанию 3)
      Цвет шрифта     <FONT COLOR="#$$$$$$"></FONT>      
N3.0b     Выбор шрифта     <FONT FACE="***"></FONT>      
N3.0b     Многоколоночный текст     <MULTICOL COLS=?></MULTICOL>      
N3.0b     Пробел между колонками     <MULTICOL GUTTER=?></MULTICOL>     (по умолчанию 10 точек)
N3.0b     Ширина колонки     <MULTICOL WIDTH=?></MULTICOL>      
N3.0b     Пустой блок     <SPACER>      
N3.0b     Тип пустого блока     <SPACER TYPE=horizontal| vertical|block>      
N3.0b     Величина пустого блока     <SPACER SIZE=?>      
N3.0b     Размеры пустого блока     <SPACER WIDTH=? HEIGHT=?>      
N3.0b     Выравнивание     <SPACER ALIGN=left|right|center>      
ССЫЛКИ И ГРАФИКА
      Ссылка     <A HREF="URL"></A>      
      Ссылка на закладку     <A HREF="URL#***"></A>     (в другом документе)
<A HREF="#***"></A>     (в том же документе)
N2.0     На другое окно     <A HREF="URL" TARGET="***| |_blank|_self|_parent|_top"></A>      
      Определить закладку     <A NAME="***"></A>      
      Отношение     <A REL="***"></A>     (часто не поддерживается)
      Обратное отношение     <A REV="***"></A>     (часто не поддерживается)
      Графика     <IMG SRC="URL">      
      Выравнивание     <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>      
N1.0     Выравнивание     <IMG SRC="URL" ALIGN=TEXTTOP| ABSMIDDLE|BASELINE|ABSBOTTOM>      
      Альтернатива     <IMG SRC="URL" ALT="***">     (выводится если картинка не изображается)
      Карта     <IMG SRC="URL" ISMAP>     (нужна также программа)
      Локальная карта     <IMG SRC="URL" USEMAP="URL">      
      Определение карты     <MAP NAME="***"></MAP>      
      Области карты     <AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF>      
      Размеры     <IMG SRC="URL" WIDTH=? HEIGHT=?>     (в точках)
      Окантовка     <IMG SRC="URL" BORDER=?>     (в точках)
      Отступ     <IMG SRC="URL" HSPACE=? VSPACE=?>     (в точках)
N1.0     Заменитель в низком разрешении     <IMG SRC="URL" LOWSRC="URL">      
N1.1     Обновить     <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">      
N2.0     Включить об'ект     <EMBED SRC="URL">     (вставить об'ект в страницу)
N2.0     Размер об'екта     <EMBED SRC="URL" WIDTH=? HEIGHT=?>      
РАЗДЕЛИТЕЛИ
      Параграф     <P></P>     (закрывать элемент часто не обязательно)
      Выравнивание     <P ALIGN=LEFT|CENTER|RIGHT></P>      
      Новая строка     <BR>     (одиночный перевод строки)
      Убрать выравнивание     <BR CLEAR=LEFT|RIGHT|ALL>      
      Горизонтальный разделитель     <HR>      
      Выравнивание     <HR ALIGN=LEFT|RIGHT|CENTER>      
      Толщина     <HR SIZE=?>     (в точках)
      Ширина     <HR WIDTH=?>     (в точках)
N1.0     Ширина в процентах     <HR WIDTH="%">     (в процентах от ширины страницы)
      Сплошная линия     <HR NOSHADE>     (без трехмерных эффектов)
N1.0     Нет разбивки     <NOBR></NOBR>     (запрещает перевод строки)
N1.0     Перенос     <WBR>     (где разбивать строку для переноса при необходимости)
СПИСКИ    

 
      Неупорядоченный     <UL><LI></UL>     (<LI> перед каждым элементом)      
      Компактный     <UL COMPACT></UL>      
      Тип метки     <UL TYPE=DISC|CIRCLE|SQUARE>     (для всего списка)      
<LI TYPE=DISC|CIRCLE|SQUARE>     (этот и последующие)      
      Нумерованый     <OL><LI></OL>     (<LI> перед каждым элементом)      
      Компактный     <OL COMPACT></OL>      
      Тип нумерации     <OL TYPE=A|a|I|i|1>     (для всего списка)      
<LI TYPE=A|a|I|i|1>     (этот и следующие)      
      Первый номер     <OL START=?>     (для всего списка)      
<LI VALUE=?>     (этот и следующие)      
      Список определений     <DL><DT><DD></DL>     (<DT>=термин, <DD>=определение)      
      Компактный     <DL COMPACT></DL>      
      Меню     <MENU><LI></MENU>     (<LI> перед каждым элементом)      
      Компактное     <MENU COMPACT></MENU>      
      Каталог     <DIR><LI></DIR>     (<LI>перед каждым элементом)      
      Компактный     <DIR COMPACT></DIR>      
ФОН И ЦВЕТА
      Фоновая картинка     <BODY BACKGROUND="URL">      
      Цвет фона     <BODY BGCOLOR="#$$$$$$">     (порядок: красный/зеленый/синий)
      Цвет текста     <BODY TEXT="#$$$$$$">      
      Цвет ссылки     <BODY LINK="#$$$$$$">      
      Пройденная ссылка     <BODY VLINK="#$$$$$$">      
      Активная ссылка     <BODY ALINK="#$$$$$$">      
(Дополнительная информация)
СПЕЦИАЛЬНЫЕ СИМВОЛЫ(обязаны быть в нижнем регистре)
      Специальный символ     &#?;     (где ? это код ISO 8859-1)
      <     &lt;      
      >     &gt;      
      &     &amp;      
      "     &quot;      
      Торговая марка ТМ     &reg;      
      Copyright     &copy;      
      Неразделяющий пробел     &nbsp;      
(Полный список)
ФОРМЫ
      Определить форму     <FORM ACTION="URL" METHOD=GET|POST></FORM>      
N2.0     Посылка файла     <FORM ENCTYPE="multipart/form-data"></FORM>      
      Поле ввода     <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET">      
      Имя поля     <INPUT NAME="***">      
      Значение поля     <INPUT VALUE="***">      
      Отмечен?     <INPUT CHECKED>     (checkboxes и radio boxes)
      Размер поля     <INPUT SIZE=?>     (в символах)
      Максимальная длина     <INPUT MAXLENGTH=?>     (в символах)
      Список вариантов     <SELECT></SELECT>      
      Имя списка     <SELECT NAME="***"></SELECT>      
      Число вариантов     <SELECT SIZE=?></SELECT>      
      Маножественний выбор     <SELECT MULTIPLE>     (можно выбрать больше одного)
      Опция     <OPTION>     (элемент который может быть выбран)
      Опция по умолчанию     <OPTION SELECTED>      
      Ввод текста, размер     <TEXTAREA ROWS=? COLS=?></TEXTAREA>      
      Имя текста     <TEXTAREA NAME="***"></TEXTAREA>      
N2.0     Разбивка на строки     <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>      
Таблицы
      Определить таблицу     <TABLE></TABLE>      
      Окантовка таблицы     <table border=?></TABLE>      
      Расстояние между ячейками     <TABLE CELLSPACING=?>      
      Дополнение ячеек     <TABLE CELLPADDING=?>      
      Желаемая ширина     <TABLE WIDTH=?>     (в точках)
      Ширина в процентах     <TABLE WIDTH="%">     (проценты от ширины страницы)
      Строка таблицы     <TR></TR>      
      Выравнивание     <TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>      
      Ячейка таблицы     <TD></TD>     (должна быть внутри строки)
      Выравнивание     <TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>      
      Без перевода строки     <TD NOWRAP>      
      Растягивание по колонке     <TD COLSPAN=?>      
      Растягивание по строке     <TD ROWSPAN=?>      
N1.1     Желаемая ширина     <TD WIDTH=?>     (в точках)
N1.1     Ширина в процентах     <TD WIDTH="%">     (проценты от ширины страницы)
N3.0b     Цвет ячейки     <TD BGCOLOR="#$$$$$$">      
      Заголовок таблицы     <TH></TH>     (как данные, но жирный шрифт и центровка)
      Выравнивание     <TH ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>      
      Без перевода строки     <TH NOWRAP>      
      Растягивание по колонке     <TH COLSPAN=?>      
      Растягивание по строке     <TH ROWSPAN=?>      
N1.1     Желаемая ширина     <TH WIDTH=?>     (в точках)
N1.1     Ширина в процентах     <TH WIDTH="%">     (проценты ширины таблицы)
N3.0b     Цвет ячейки     <TH BGCOLOR="#$$$$$$">      
      Заглавие таблицы     <CAPTION></CAPTION>      
      Выравнивание     <CAPTION ALIGN=TOP|BOTTOM>     (сверху/снизу таблицы)
ФРЕЙМЫ
N2.0     Документ с фреймами     <FRAMESET></FRAMESET>     (вместо <BODY>)
N2.0     Высота строк     <FRAMESET ROWS=,,,></FRAMESET>     (точки или %)
N2.0     Высота строк     <FRAMESET ROWS=*></FRAMESET>     (* = относительный размер)
N2.0     Ширина колонок     <FRAMESET COLS=,,,></FRAMESET>     (точки или %)
N2.0     Ширина колонок     <FRAMESET COLS=*></FRAMESET>     (* = относительный размер)
N3.0b     Ширина окантовки     <FRAMESET BORDER=?>      
N3.0b     Окантовка     <FRAMESET FRAMEBORDER="yes|no">      
N3.0b     Цвет окантовки     <FRAMESET BORDERCOLOR="#$$$$$$">      
N2.0     Определить фрейм     <FRAME>     (содержание отдельного фрейма)
N2.0     Документ     <FRAME SRC="URL">      
N2.0     Имя фрейма     <FRAME NAME="***"|_blank|_self| _parent|_top>      
N2.0     Ширина границы     <FRAME MARGINWIDTH=?>     (правая и левая границы)
N2.0     Высота границы     <FRAME MARGINHEIGHT=?>     (верхняя и нижняя границы)
N2.0     Скроллинг?     <FRAME SCROLLING="YES|NO|AUTO">      
N2.0     Постоянный размер     <FRAME NORESIZE>      
N3.0b     Окантовка     <FRAME FRAMEBORDER="yes|no">      
N3.0b     Цвет окантовки     <FRAME BORDERCOLOR="#$$$$$$">      
N2.0     Содержание без фреймов     <NOFRAMES></NOFRAMES>     (для просмотрщиков не поддерживающих фреймы)
ЯЗЫК JAVA
      Applet     <APPLET></APPLET>      
      Applet - имя файла     <APPLET CODE="***">      
      Параметры     <APPLET PARAM NAME="***">      
      Applet - адрес     <APPLET CODEBASE="URL">      
      Applet - имя     <APPLET NAME="***">     (для ссылок из других частей страницы)
      Альтернативный текст     <APPLET ALT="***">     (для программ не поддерживающих Java)
      Выравнивание     <APPLET ALIGN="LEFT|RIGHT|CENTER">      
      Размеры     <APPLET WIDTH=? HEIGHT=?>     (в точках)
      Отступ     <APPLET HSPACE=? VSPACE=?>     (в точках)
РАЗНОЕ
      Комментарий     <!-- *** -->     (игнорируется просмотрщиком)
      Пролог HTML 3.2     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">      
      Поиск     <ISINDEX>     (означает начальную точку поиска)
      Приглашение     <ISINDEX PROMPT="***">     (текст приглашения для поля ввода)
      Запустить поиск     <A HREF="URL?***"></a>     (используйте действительно знак вопроса)
      URL этого файла     <BASE HREF="URL">     (должно быть в заголовке)
N2.0     Имя базового окна     <BASE TARGET="***">     (должно быть в заголовке)
      Отношение     <LINK REV="***" REL="***" HREF="URL">     (должно быть в заголовке)
      Метаинформация     <META>     (должно быть в заголовке)
      Стили     <STYLE></STYLE>     (часто не поддерживается)
      Программа     <SCRIPT></SCRIPT>     (часто не поддерживается)

Домен продается

Популярное

Не так давно в сети появился новый сервис, под названием Dead Man Zero. Этот сервис сделал...
Рынок социальных площадок уже давно стал стабильным. Несмотря на то, что время от времени...
Artisteer 4 – единственный в своем роде продукт, позволяющий автоматизировать работу над созданием...
Октябрь 2018 (14)
Февраль 2017 (3)
Январь 2017 (1)
Август 2016 (1)
Май 2016 (2)
Ноябрь 2015 (1)

Карта сайта: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41

Друзья сайта



Случайная цитата

Оноре де Бальзак:

"Тот, кто ищет миллионы, весьма редко их находит, но зато тот, кто не ищет, не находит их никогда."

Опрос

Какой браузер Вы используете?

Internet Explorer
Google Chrome
Mozilla Firefox
Netscape Navigator
Maxthon Browser
Opera
Mozilla Suite
SeaMonkey
K-Meleon
Safari
Amaya
Avant Browser
SlimBrowser
Другой...