- Что такое «HTML»?
- Что такое «XHTML»?
- Что такое
DOCTYPE
и зачем он нужен? - Для чего предназначен тег
<head>
? - Чем отличается
<div>
от<span>
? - Как обозначаются комментарии в HTML?
- Каким образом задаётся адрес документа, на который следует перейти?
- Как сделать ссылку на адрес электронной почты?
- Для чего предназначен тег
<em>
? - Для чего предназначены теги
<ol>
,<ul>
,<li>
? - Для чего предназначены теги
<dl>
,<dt>
,<dd>
? - Для чего предназначены теги
<tr>
,<th>
,<td>
? - Обязательно ли писать атрибут
alt
в теге<img>
? - В каком регистре лучше писать HTML-код?
- Что такое «мнемоника (entity)»?
HTML, HyperText Markup Language («язык гипертекстовой разметки») — стандартизированный язык разметки документов в WWW. На данный момент актуальна 5 версия этого языка - HTML5.
XHTML, eXtensible HyperText Markup Language («расширяемый язык гипертекстовой разметки») - более строгий вариант HTML, следующий всем ограничениям XML и, фактически являющийся приложением языка XML к области разметки гипертекста.
Элемент <!DOCTYPE>
предназначен для указания типа текущего документа. Это необходимо, чтобы браузер понимал, согласно какому стандарту, необходимо интерпретировать данную web-страницу.
Существует несколько видов <!DOCTYPE>
, различающихся версией языка, на который они ориентированы:
HTML 4.01
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
: строгий синтаксис HTML; -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
: переходный синтаксис HTML; -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
: HTML с фреймами.
HTML 5
<!DOCTYPE html>
: для всех документов.
XHTML 1.0
-
<!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 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
: переходный синтаксис XHTML; -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
: XHTML с фреймами.
XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
: для всех документов.
Тег <head>
предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными. Также внутри этого контейнера находятся метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам для получения описания сайта, ключевых слов и других данных.
Содержимое тега <head>
не отображается напрямую на web-странице, за исключением тега <title>
устанавливающего заголовок окна.
Внутри контейнера <head>
допускается размещать следующие элементы: <base>
, <basefont>
, <bgsound>
, <link>
, <meta>
, <script>
, <style>
, <title>
.
Синтаксис:
<head>
...
</head>
Специфические атрибуты:
profile
: указывает адрес профиля метаданных.
<div>
- блочный, а <span>
- строчный элементы. Поэтому <div>
формирует блок из того, что в нем располагается с новой строки, а <span>
не переносит элементы, размещая их в строку. Так же стоит отметь, что согласно рекомендациям w3c линейный тег не может включать в себя блочные теги, поэтому <div>
обычно используется для разметки блоков, а <span>
- отрывков текста.
Комментарий в HTML-коде задаётся так: <!-- комментарий -->
Комментарии можно использовать в любом месте страницы, кроме тега <title>
— внутри него они не работают. Внутри тега <style>
HTML-комментарии тоже не работают, так как в CSS код комментируется другим способом.
Для создания ссылок на другие документы используется тег <a>
. В зависимости от присутствия атрибутов name
или href
тег <a>
устанавливает ссылку или якорь. Якорем называется закладка внутри страницы, которую можно указать в качестве цели ссылки. При использовании ссылки, которая указывает на якорь, происходит переход к закладке внутри web-страницы.
Синтаксис:
<a href="URL">...</a>
<a name="идентификатор">...</a>
Специфические атрибуты:
accesskey
: активация ссылки с помощью комбинации клавиш;coords
: устанавливает координаты активной области;download
: предлагает скачать указанный по ссылке файл;href
: задает адрес документа, на который следует перейти. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Относительные ссылки, как следует из их названия, построены относительно текущего документа или корня сайта;hreflang
: идентифицирует язык текста по ссылке;name
: устанавливает имя якоря внутри документа;rel
: отношения между ссылаемым и текущим документами;rev
: отношения между текущим и ссылаемым документами;shape
: задает форму активной области ссылки для изображений;tabindex
: определяет последовательность перехода между ссылками при нажатии на кнопку Tab;target
: имя окна или фрейма, куда браузер будет загружать документ;title
: добавляет всплывающую подсказку к тексту ссылки;type
: указывает MIME-тип документа, на который ведёт ссылка.
Создание ссылки на адрес электронной почты делается почти также, как и ссылка на web-страницу. Только вместо URL указывается mailto:"адрес электронной почты"
<a href="mailto:[email protected]">Напиши мне!</a>
Тег <em>
предназначен для акцентирования текста. Браузеры отображают такой текст курсивным начертанием.
<em>Текст</em>
Теги <ol>
, <ul>
и <li>
предназначены для оформления списков.
<ol>
: нумерованный список, т.е. каждый элемент списка начинается с числа или буквы и увеличивается по нарастающей.<ul>
: маркированный список, каждый элемент которого начинается с небольшого символа — маркера.<li>
: отдельный элемент списка. Внешний тег<ul>
или<ol>
устанавливает тип списка — маркированный или нумерованный.
<ol>Нумерованый список
<li>первый</li>
<li>второй</li>
<li>третий</li>
</ol>
<ul>Маркированный список
<li>первый</li>
<li>второй</li>
<li>третий</li>
</ul>
Теги <dl>
, <dt>
, <dd>
предназначены для создания списка определений.
Каждый такой список начинается с контейнера <dl>
, куда входит тег <dt>
создающий термин и тег <dd>
задающий определение этого термина. Закрывающий тег </dd>
не обязателен, поскольку следующий тег сообщает о завершении предыдущего элемента. Тем не менее, хорошим стилем является закрывать все теги.
<dl>Список определений
<dt>Термин</dt>
<dd>Определение</dd>
</dl>
<tr>
: служит контейнером для создания строки таблицы. Каждая ячейка в пределах такой строки может задаваться с помощью тега <th>
или <td>
.
<th>
: предназначен для создания одной ячейки заголовка таблицы.
<td>
: предназначен для создания одной ячейки таблицы.
<table>
<tr>
<th>Заголовок</td>
</tr>
<tr>
<td>Строка</td>
</tr>
</table>
Да, писать его обязательно.
Атрибут alt
устанавливает альтернативный текст для изображений. Такой текст позволяет получить текстовую информацию о рисунке при отключенной в браузере загрузке изображений. Поскольку загрузка изображений происходит после получения браузером информации о нем, то замещающий рисунок текст появляется раньше. А уже по мере загрузки текст будет сменяться изображением.
<img src="forest.jpg" alt="Лес">
Весь HTML-код рекомендуется писать в нижнем регистре: это относится к названиям элементов, названиям атрибутов, значениям атрибутов (кроме текста/CDATA
), селекторам, свойствам и их значениям (кроме текста).
Не рекомендуется
<A HREF="/">Домой</A>
Рекомендуется
<img src="forest.jpg" alt="Лес">
Мнемоника (entity) - это конструкция из символа &
и буквенного (или цифрового кода) после нее, предназначенная для замещения символов, которые запрещены для использования в HTML в «явном виде».
# имеет мнемонику
#