Теги HTML5
В этом разделе размещены описания и примеры использования основных тегов. В html5 - языке разметки гипертекста много нового и интересного. Появилось множество семантических элементов, с помощью которых поисковые роботы более правильно и полно индексируют содержание страниц. Также появился ряд новых тегов, позволяющих вставлять аудио и видео на сайт. Теперь не надо устанавливать граммосткие аудио и видео плееры на сайт, или вставлять коды со сторонних сервисов. Ниже более подробное описание и примеры применения основных элементов html5.
Теги - контейнеры для содержимого
<!DOCTYPE> - указывает браузеру о версии языка разметки html документа<html> - этот тег говорит что внутри него содержится html код<head> - в нем содержатся мета данные для браузера и поисковых систем<body> - в нем заключается все видимое содержимое от шапки до подвала<header> - обозначает шапку сайта и иногда сложные заголовки статей<main> - в нем заключается контент, содержимое между шапкой и подвалом<article> - обозначает конкретное содержимое типа статьи или новости <aside> - определает независимое содержимое боковой блок или колонку и др<section> - предназначен для разделения контента на секции<div> - используется для создания контейнеров, блоков для содержимого<footer> - в этом теге заключается содержимое подвала сайтаТеги для разметки текста
<nav> - определяет и используется для навигации по сайту
<menu> - используется для семантической разметки списка меню
<h1> <h2> <h3> <h4> <h5> <h6> - используются для разметки заголовков
<p> - используется для разметки текста на абзацы<br> - применяется при разметке текста для переноса строки<i> и <em> - применяются для выделения текста курсивным шрифтом<b> и <strong> - эти теги выделяют текст жирным шрифтом<a> - этот тег создает ссылки на внутренние и внешние страницы<abbr> - тег для аббревиатур, расшифровки сокращенных и сленговых слов<address> - предназначен для указания адреса автора сайта или контента<blockquote> и <cite> - предназначены для выделения цитат<dl> <dt> <dd> - предназначены для разметки списка определений<details> - создает скрытое содержание или детали к элементам <code> - предназначен для выделения программного кода в тексте
<ul> <li> <ol> - создают маркированный и нумерованный список
<small> - уменьшает выделенный текст, делает его меньше чем основнойТеги для разметки графики, мультимедиа
<img> - этот тег служит для вставки изображения <figure> и <figcaption> - используются для обозначения изображений <map> и <area> - используется для создания карты ссылок на изображении<audio> - предназначен для воспроизведения аудио файлов на странице<video> - позволяет воспроизводить видео файлы на странице<canvas> - предназначен для создания графики при помощи JavaScript<hr> - этот тег создает горизонтальную линиюТеги для создания таблиц
<table> <td> <tr> <caption> <col> <colgroup> <tbody> <tfoot> <th> <thead> - Теги для создания таблицы, назначение и краткое описание<table> <tr> <td> - основные теги для создания таблицы<caption> - предназначен для создания заголовка таблицы<col> - задает параметры столбцов в таблицах<colgroup> - предназначен для группирования столбцов (колонок) таблицыРазличные другие теги
<meta> - в нем указывается информация для браузеров и поисковых систем<link> - указывает браузеру пути до файлов в теге <head> <base> - указывает базовый адрес путей, с которого начинаются пути<button> - предназначен для создания кнопок в формах<form> - создает формы отправки данных на странице<fieldset> - группирует содержимое форм отправки данных<iframe> - создает фреймы для загрузки на страницу других веб страниц<input> - создает разные элементы взаимодействия в формах<keygen> - используется для шифрования при отправке данных