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 – единственный в своем роде продукт, позволяющий автоматизировать работу над созданием...
Февраль 2017 (3)
Январь 2017 (1)
Август 2016 (1)
Май 2016 (2)
Ноябрь 2015 (1)
Октябрь 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

Друзья сайта

Хотите продать свой сайт?
- Мы быстро и удобно для Вас сможем его купить:
  • Заявка на продажу сайта
  • Раcсматриваем цены на каждый сайт в индивидуальном порядке.

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

    Неизвестный автор:

    "Танцевать можно от печки, а сочинять дизайн - от лампочки."

    Опрос

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

    OpenOffice
    AbiWord
    Notepad++
    UltraEdit
    PSPad
    Microsoft Office
    Microsoft Блокнот
    Другой...