2012-08-06

Теги html5

<article> </article>
Теги <article> </article> определяют новость с чужого источника или статью: <article> <h1><a href="http://.....com">Название статьи</a></h1> <p>Статья....</p> </article>

<aside> </aside>
Теги <aside> </aside> определяют дополнительный контент: <!DOCTYPE HTML> <html> <body> <p>На выходных мы с друзьями собираемся покорить вершину Ай-Петри...</p> <aside> <h4>Ай-Петри</h4> <p>Ай-Петри – вершина в Крымских горах, высота 1234 м...</p> </aside> </body> </html>



<audio> </audio>
Теги <audio> </audio> определяют фоновый звук, музыку или другой аудио поток на сайте: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> </head> <body> <audio src="music.ogg" controls="controls"> Ваш браузер не поддерживает теги <audio> </audio>! Обновите версию браузера! </audio> </body> </html>

<figure> </figure>
Теги <figure> </figure> группируют элементы web-страницы по смыслу: <!DOCTYPE HTML> <html> <body> <figure> <h4>W3C</h4> <p>W3C – oрганизация, разрабатывающая и внедряющая технологические стандарты для Всемирной паутины...</p> </figure> </body> </html>

<dialog> </dialog>
Теги <dialog> </dialog> определяют диалог: <!DOCTYPE HTML> <html> <body> <dialog> <dt>Прохожий</dt> <dd>— Доброе утро!</dd> <dt>Пассажир</dt> <dd>— Доброе...</dd> <dt>Прохожий</dt> <dd>— Как ваши дела?</dd> <dt>Пассажир</dt> <dd>— Простите, а вы кто?</dd> </dialog> </body> </html>

<command> </command>
Теги <command> </command> отображают команды для выпадающих списков, кнопок: <!DOCTYPE HTML> <html> <body> <menu> <command type="command">Выбирите...</command> </menu> </body> </html>

<fieldset> </fieldset>
Теги <fieldset> </fieldset> объединяют элементы формы: <form action=""> <fieldset> <legend>Немного о себе:</legend><br /> <input type="radio" name="Sex" value="Мужской" checked="checked" /> Мужчина<br /> <input type="radio" name="Sex" value="Женский" /> Женщина<br /> <input type="text" size="20" /> Возраст<br /> <input type="text" size="20" /> Страна<br /> <input type="submit" value="Отправить" /><br /> </fieldset> </form>

<header> </header>
Теги <header> </header> определяют начало документа, его главную часть: <html> <head> </head> <body> <header> <h2>Современные уроки по HTML</h2> <p>HTML 5 – новая версия Гипертекстового языка разметки документов...</p> </header> ........... </body> </html>

<hgroup> </hgroup>
Теги <hgroup> </hgroup> определяют группу заголовков: <html> <body> <hgroup> <h1>HTML справочник</h1> <h4>Новые теги</h4> </hgroup> <p>В спецификации HTML 5 представлены новые теги...</p> </body> </html>

<footer> </footer>
Теги <footer> </footer> определяют нижнюю часть документа или секции: <!DOCTYPE HTML> <html> <body> <footer>Дата публикации: Февраль 2010</footer> </body> </html>

<mark> </mark>
Теги <mark> </mark> определяют важную по смыслу часть текста: <html> <body> <p>В <b>HTML 5</b> введены <mark>новые теги</mark>.</p> </body> </html> Теги <mark> </mark> никак не форматируют текст, вероятно, такая маркеровка используется для поисковой оптимизации.

<nav> </nav>
Теги <nav> </nav> определяют навигационное меню: <html> <body> <nav> <a href="#">Предыдущая страница</a> <a href="#">Следующая страница</a> </nav> </body> </html>

<section> </section>
Теги <section> </section> аналогично <div> </div> определяют секцию (блок): <html> <body> <section align="center"> <h4>HTML 5 теги</h4> <p>В пятой версии HTML появились <i>новые теги</i>...</p> <p> ............. </p> </section> </body> </html>

<time> </time>
Теги <time> </time> выделяют время или дату в тексте: <html> <body> <p>Занятия начинаются в <time>8:30</time>.</p> </body> </html> <p>I have a date on <time datetime="2008-02-14">Valentines day</time>.</p> <br> format: YYYY-MM-DDThh:mm:ssTZD The date or time being specified. Explanation of components: YYYY - year (e.g. 2011) MM - month (e.g. 01 for January) DD - day of the month (e.g. 08) T - a required separator if time is also specified hh - hour (e.g. 22 for 10.00pm) mm - minutes (e.g. 55) ss - seconds (e.g. 03) TZD - Time Zone Designator (Z denotes Zulu, also known as Greenwich Mean Time)

<video> </video>
Теги <video> </video> определяют видео на сайте: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> </head> <body> <video src="video.mp4" controls="controls"> Ваш браузер не поддерживает теги <video> </video>! Обновите версию браузера! </video> </body> </html>
Тег <source /> определяет источник видео:
<video controls="controls"> <source src="video.m4v" type="video/mp4" /> <!-- MPEG4 для браузеров Safari --> <source src="video.ogg" type="video/ogg" /> <!-- Ogg Theora для Firefox --> </video>


Атрибуты и значения:
autoplay="autoplay" – видео воспроизводится сразу после загрузки страницы.
autobuffer="autobuffer" – видео воспроизводится уже в момент загрузки страницы.
controls="controls" – панель управления видеоплеером.
loop="loop" – по окончанию, видео проигрывается снова.
src="url" – источник видео.
type="video/ogg" – определяет формат видео.
height="" – высота видеоплеера.
width="" – ширина видеоплеера.

No comments:

Post a Comment