| Тег | Содержится в | Описание тега | Основные атрибуты |
|---|---|---|---|
| !DOCTYPE | Находится в первой строке документа | Объявляет тип документа | нет |
| Для объявления правильного XHTML документа используется со значениями параметров: <!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd»> Для объявления XHTML-документа переходного типа используется со значениями параметров: <!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd»> Для объявления XHTML-документа с фреймами используется со значениями параметров: <!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd»> |
|||
| <а> </a> | <body> | Выделяет гиперссылку | id, class, title, lang, dir; name, href, target |
| Пример использования тега для создания обычной гиперссылки: <a href=”http://uspu.ru” title=”Ссылка на сервер УрГПУ” target=”_blank”>Перейти на сайт УрГПУ</a> Пример создания закладки: <a name=”news”>Новости</a> … <a href=”#news”>Перейти на раздел новостей</a> |
|||
| <abbr> </abbr> | <body> | Используется для обозначения аббревиатурных сокращений. В случае, когда сокращение — удобопроизносимое слово, целесобразно использовать тег acronym. | id, class, title; lang, dir; |
| <abbr title=”Уральский Государственный Педагогический Университет”>УрГПУ</abbr> | |||
| <acronym> </acronym> | <body> | Используется для легко читаемых аббревиатурных сокращений. В случае, когда сокращение — аббревиатурное слово, целесобразно использовать тег abbr. | id, class, title; lang, dir; |
| <acronym title=”North Atlantic Treaty Organization”>NATO</acronym> | |||
| <address> </address> | <body> | Выделяет контактную информацию для документа или части документа. Информация может содержать название или ссылку Web, адрес телефонной почты, телефонные номера и т.д. | id, class, title; lang, dir; |
| <address>Наш контактный телефон: 333-33-33</address> | |||
| <area /> | <map> | Задает активную область изображения в навигационной карте ссылок | id, class, title; alt, coords, href, nohref=”noshref”, shape, target |
| <area href=»01.html» shape=»rect» coords=»0,0,70,140″ alt=»левая часть» /> <area nohref=»nohref» shape=»rect» coords=»71,0,140,140″ alt=»центральная часть» /> <area href =»02.html» shape =»rect» coords=»141,0,210,140″ alt=»правая часть» target=”_blank” /> |
|||
| <b></b> | <body> | Ограничивает выделенный жирным текст. | id, class, title; lang, dir; |
| <b>Во-первых,</b>необходимо… | |||
| <big></big> | <body> | Выделение текста путем увеличения относительно основного шрифта | id, class, title; lang, dir; |
| Будьте <big>осторожны</big>! | |||
| <blockquote> </blockquote> | <body> | Используется для выделения цитаты, может содержать элементы p, но не может в них содержаться. | id, class, title; lang, dir; cite |
| <blockquote><p>Всё, что есть хорошего в жизни, либо аморально, либо незаконно, либо ведет к ожирению! </p></blockquote> | |||
| <body> </body> | <html> после блока <head>… </head>, либо в <noframes> | Раздел XHTML документа с информативной частью | id, class, title; lang, dir; |
| Пример см. для элемента html и frameset | |||
| <br /> | <body> | Определяет начало строки | id, class, title |
| Наша Таня громко плачет, <br />Уронила в речку мячик. | |||
| <cite> </cite> | <body> | Используется для выделения цитируемых слов в предложении. | id, class, title; lang, dir; |
| Автор статьи утверждает, что <cite> “ все структурные элементы текста должны быть четко определены”</cite> | |||
| <code> </code> | <body> | Используется для выделения фрагмента компьютерного кода. | id, class, title; lang, dir; |
| Программа:<code> on (release){gotoAndPlay(1);} </code> | |||
| <dd></dd> | <dl> | Выделяет пункт списка определений, в котором находится само определение термина. | id, class, title; lang, dir; |
| Пример см. для элемента dl | |||
| <dfn></dfn> | <body> | Используется для выделения определений и терминов в тексте. | id, class, title; lang, dir; |
| <dfn>Структура — расположение и связь частей, составляющих целое.</dfn> | |||
| <div></div> | <body> | Позволяет отделить или выделить текстовый блок от остальной части документа. Может содержать любой встроенный или блочный элемент, в том числе и элемент div | id, class, title; lang, dir; |
| <div class=”tutorial”>Выполните упражнение: напишите небольшой текст о Вашей школе и оформите его в виде набора XHTML-документов </div> | |||
| <dl></dl> | <body> | Выделяет список определений. Используется крайне редко. | id, class, title; lang, dir; |
| <dl> <dt>XHTML</dt><dd>Расширяемый язык разметки гипер-текста</dd> <dt>CSS</dt> <dd>Язык описания каскадных листов стилей</dd> </dl> | |||
| <dt></dt> | <dl> | Выделяет пункт списка определений, в котором находится определяемый термин. | id, class, title; lang, dir; |
| Пример см. для элемента dl | |||
| <em></em> | <body> | Используется для смыслового акцента текстового фрагмента. | id, class, title; lang, dir; |
| «Ein Mensch ist was er <em>isst</em>», гласит немецкая пословица. | |||
| <form> </form> | <body> | Определяет форму диалога с пользователем. | id, class, title; lang, dir; action, method, |
| <form action=”mailto:my_name@mail.ru” method=»post»> … </form> |
|||
| <frame /> | <frameset> | Описывает фрейм (область просмотра одного XHTML-документа) в документе с фреймами. | id, class, title; name, src, frameborder, noresize=”noresize” |
| Пример см. для элемента frameset | |||
| <frameset> </frameset> | <html> после блока <head>… </head> | Описывает структуру отображения нескольких XHTML-документов в одном окне браузера. | id, class, title; cols, rows |
| <frameset cols=”20%,*”> <frame name=”left_fr” src=”firstpage.htm” /> <frame name=”right_fr” src=”secondpage.htm” /> <noframes> <body> <p>Если броузер не предназначен для отображения фреймов, то на экране появится этот абзац</p> </body> </noframes> </frameset> |
|||
| <h1></h1> | <body> | Определяет заголовок первого уровня в документе. | id, class, title; lang, dir; |
| <h1>Глава 1</h1> | |||
| <h2></h2> | <body> | Определяет заголовок второго уровня в документе. | id, class, title; lang, dir; |
| <h2>§2</h2> <!— в главе 1 —> |
|||
| <h3></h3> | <body> | Определяет заголовок третьего уровня в документе. | id, class, title; lang, dir; |
| <h3>Раздел 2.3 </h3> <!— в параграфе 2 главы 1 —> |
|||
| <h4></h4> | <body> | Определяет заголовок четвертого уровня в документе. | id, class, title; lang, dir; |
| <h4>Пункт 2.3.4 </h4> <!— в разделе 2.3 в параграфе 2 главы 1 —> |
|||
| <h5></h5> | <body> | Определяет заголовок пятого уровня в документе. | id, class, title; lang, dir; |
| <h5>Подпункт 2.3.4.5 </h5> <!— в пункте 2.3.4 в разделе 2.3 в параграфе 2 главы 1 —> |
|||
| <h6></h6> | <body> | Определяет заголовок шестого уровня в документе. Используется крайне редко. | id, class, title; lang, dir; |
| <h6>2.3.4.5 </h6> <!—5-й ещё более мелкий элемент структуры в подпункте 2.3.4.5 в пункте 2.3.4 разделе 2.3 параграфе 2 главы 1 —> |
|||
| <head></head> | <html> | Определяет раздел информации о документе. Не может содержать текст. | id; lang, dir; |
| Пример см. для элемента html | |||
| <hr /> | <body> | С помощью этого элемента вставляется горизонтальная линия, служащая для разделения текстов или блоков | id, class, title; lang, dir; |
| <p>…</p> <hr /><p>Примечание. ….</p> | |||
| <html></html> | Во второй строке после тега !DOCTYPE | Задает границы XHTML-документа | id, lang, dir; xmlns=”http://www.w3.org/1999/xhtml” |
| <!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd»> <html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”ru” lang=”ru”> <head><title>Минимальный XHTML-документ </title></head> <body><p>Текстовая информация </p></body> </html> |
|||
| <i></i> | <body> | Ограничивает текст, выделенный курсивом. | id, class, title; lang, dir; |
| <i>Казнить</i> нельзя помиловать. | |||
| <img /> | <body> | Используется для вставки в XHTML-документ изображения в формате gif, jpg или png | id, class, title; lang, dir; src, alt, width, height |
| <img src=”cats.jpg” alt=”Фото с кошками”> | |||
| <input /> | <form> | Определяет элемент формы. | id, class, title; lang, dir; type, name, value, checked; readonly; size, maxlength, alt |
| <input type=”text” name=”fio” size=”20” maxlength=”100” /> | |||
| <li></li> | <ol>, либо <ul> | Определяет пункт списка. | id, class, title; lang, dir; |
| <ul><li>Карандаш</li><li>Ручка</li></ul> | |||
| <link /> | <head> | Определяет связи документа. | id, title, class; lang, dir; charset, href, type, rel, rev |
| <link rel=”stylesheet” href=”mystyle.css” type=”text/css” /> | |||
| <map></map> | <body> | Задает карту ссылок для изображения | id, title, class; lang, dir; name |
| <map name=»image»> <area href=»01.html» shape=»rect» coords=»0,0,70,140″ alt=»левая часть» /> <area nohref=»nohref» shape=»rect» coords=»71,0,140,140″ alt=»центральная часть» /> <area href =»02.html» shape =»rect» coords=»141,0,210,140″ alt=»правая часть» /> </map> <img src=»img/kartinka.gif» usemap=»#image» height=»140″ width=»140″ /> |
|||
| <meta /> | <head> | Определяет информацию о документе и об информации в документе. | id; lang, dir; http-equiv, name, content |
| <meta name=”author” content=”Иванов И.И.” /> | |||
| <noframes> </noframes> | <frameset> | Содержит альтернативную информацию, которая отобразится на экране в случае, если браузер не поддерживает документы с фреймами. | id, class, title; lang, dir; |
| Пример см. для элемента frameset | |||
| <object> </object> | <body> | Определяет включение в XHTML-документ различных мультимедиа-объектов (видео, звук, изображения, VRML-объекты и т.п.) | id, class, title; lang, dir; classid, codebase, data, type, codetype, width, height, name |
| <object data=»avifile.avi» width=”100” height=”100”></object> | |||
| <ol></ol> | <body> | Используется для обозначения упорядоченного списка меню. Для пунктов списка используются элементы li. | id, class, title; lang, dir; |
| <ol><li>Первый</li><li>Второй</li></ol> | |||
| <option> </option> | <select> | Определяет пункты элемента меню select. | id, class, title; lang, dir; selected=”selected”, value |
| Пример см. для элемента select | |||
| <p></p> | <body> | Используется для определения абзаца. | id, class, title; lang, dir; |
| <p>Тексты возникают в результате языкового взаимодействия, и адекватное понимание сущности текста возможно лишь при учете динамических процессов языкового общения, разворачивающихся во времени и ведущих к возникновению текста. </p> | |||
| <pre></pre> | <body> | Используется для предварительно отформатированного текста. | id, class, title; lang, dir; |
| <pre>Тексты возникают в результате языкового взаимодействия, и адекватное понимание сущности текста возможно лишь при учете динамических процессов языкового общения, разворачивающихся во времени и ведущих к возникновению текста. </pre> | |||
| <q></q> | <body> | Используется для выделения фрагмента текста, который представляет собой цитату из документа, не принадлежащего автору страницы. | id, class, title; lang, dir; cite |
| <q cite=«www.pylesos.ru»>Интеллектуальные моющие пылесосы</q> рекламирует компания «Пылесос в каждый дом». | |||
| <samp> </samp> | <body> | Используется для выделения примеров, пояснений к основному тексту. | id, class, title; lang, dir; |
| <dfn>Параллелограмм — это четырехугольник, противоположне стороны которого параллельны</dfn> <samp>Пример. Квадрат является параллелограммом</samp> | |||
| <select> </select> | <form> | Используется для создания выпадающего списка выбора в форме. | id, class, title; lang, dir; name, size |
| <select name=»education»> <option value=»none»>без образования</option> <option value=»middle»>среднее/незаконченное среднее</option> <option value=»high»>высшее/незаконченное высшее</option> </select> |
|||
| <small> </small> | <body> | Используется для выделения фрагмента текста шрифтом меньшего размера по сравнению с окружающим текстом. | id, class, title; lang, dir; |
| За невыполнение условий настоящего Договора, Исполнитель несет ответственность в сумме причиненного ущерба, <small> но не более 50 копеек.</small> | |||
| <span> </span> | <body> | Является встроенным элементом внутри текстового блока, используется для выделения произвольного элемента структуры документа. | id, class, title; lang, dir; |
| В нашей библиотеке много книг. Особенным спросом у читателей пользуется <span class=”book_name”>«Война и мир» </span>. | |||
| <style> </style> | <head> | Используется для вставки в документ таблицы стиля. | id; lang, dir; type, title |
| <style type=”text/css”> p {color:green;}</style> | |||
| <strong> </strong> | <body> | Используется для смыслового выделения текстового фрагмента. | id, class, title; lang, dir; |
| Нарушения трудовой дисциплины абсолютно <strong>недопустимы</strong>. | |||
| <sub> </sub> | <body> | Выделение фрагмента текста как нижнего индекса. | id, class, title; lang, dir; |
| Химическая формула воды H<sub>2</sub>О | |||
| <sup> </sup> | <body> | Выделение фрагмента текста как верхнего индекса. | id, class, title; lang, dir; |
| Теорема Пифагора гласит: a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup> | |||
| <table> </table> | <body> | Элемент используется для обозначения табличных данных. | id, class, title; lang, dir; summary, width, border, rules, frame, cellspacing, cellpadding |
| <table> <thead> <tr> <td>№ п/п</td> <td>Количество</td> <td>Качество</td> </tr> </thead> <tbody> <tr> <td>1</td> <td>5</td> <td>4</td> </tr> <tr> <td>2</td> <td>10</td> <td>3</td> </tr> </tbody> <tfoot> <tr> <td>Итого</td> <td>15</td> <td>7</td> </tr> </tfoot> </table> |
|||
| <tbody> </tbody> | <table> | Определяет группу рядов данных таблицы. Таблица может иметь только один элемент tbody. | id, class, title; lang, dir; align, valign, char |
| Пример см. для элемента table | |||
| <td></td> | <tr> | Определяет ячейку с фактическими данными таблицы. | id, class, title; lang, dir; align, valign, char; colspan, rowspan |
| <table> <tr> <th>№ п/п</th> <th>Количество</th> <th>Качество</th> </tr> <tr> <td>1</td> <td>5</td> <td>4</td> </tr> <tr> <td>2</td> <td>10</td> <td>3</td> </tr> </table> А также см. пример для элемента table. |
|||
| <textarea> </textarea> | <form> | Определяет многострочное поле ввода текста формы. | id, class, title; lang, dir; name, cols, rows, readonly=”readonly” |
| <textarea name=”details” rows=”6” cols=”50”> Пожалуйста, опишите здесь ваши пожелания </textarea> | |||
| <tfoot></tfoot> | <table> | Определяет группу рядов нижних заголовков таблицы. Таблица может иметь только один элемент thead. | id, class, title; lang, dir; align, valign, char |
| Пример см. для элемента table | |||
| <th></th> | <tr> | Определяет ячейку с названием данных колонки таблицы. Обычно помещается в первую строку таблицы. | id, class, title; lang, dir; align, valign, char; colspan, rowspan |
| Пример см. для элемента td | |||
| <thead> </thead> | <table>, после тега | Определяет группу рядов заголовков таблицы. Таблица может иметь только один элемент thead. | id, class, title; lang, dir; align, valign, char |
| Пример см. для элемента table | |||
| <title></title> | <head> | В этот элемент записывается определение имени всего документа | id; lang, dir; |
| <title>Справочник тегов XHTML 1.0</title> | |||
| <tr></tr> | <thead>, либо <tbody>, либо <tfoot> | Определяет новый ряд таблицы ячеек. | id, class, title; lang, dir; align, valign, char |
| Пример см. для элемента table | |||
| <tt></tt> | <body> | Этот элемент используется для выделения текста телетайпным моноширинным шрифтом. | id, class, title; lang, dir; |
| Текст телеграммы: <tt>Всё хорошо тчк</tt> | |||
| <ul></ul> | <body> | Используется для обозначения неупорядоченного списка меню. Для пунктов списка используются элементы li. | id, class, title; lang, dir; |
| <ul> <li>Карандаш</li> <li>Ручка</li> </ul> |
|||
| <var></var> | <body> | Используется для обозначения переменных. | id, class, title; lang, dir; |
| <var>x</var>+5=6 | |||
Жесть, спасибо за материал)