<!DOCTYPE html>
<html>
<head>
<!-- Метаданные тсраницы -->
</head>
<body>
<!-- Контент страницы -->
</body>
</html>
Базовые элементы в HTML5
HTML-элементы, позволяющие создать самую простую веб-страницу
# body
Контейнер для контента на веб-странице. Должен быть прямым ребенком тега <html>
, и должен быть предком всех элементов HTML на странице.
Пример: Скопировать
# head
Определяет контейнер для метаданных веб-страницы.
Пример: Скопировать
<!DOCTYPE html>
<html>
<head>
<!-- Метаданные страницы -->
</head>
<body>
<!-- Контент страницы -->
</body>
</html>
# html
Определяет корневой элемент документа HTML. Все остальные элементы должны содержаться внутри этого корневого элемента.
Пример: Скопировать
<!DOCTYPE html>
<html>
<head>
<!-- Метаданные страницы -->
</head>
<body>
<!-- Контент страницы -->
</body>
</html>
# link
Определяет ссылку между текущей веб-страницей и внешней ссылкой или ресурсом.
Пример: Скопировать
<link rel="stylesheet" type="text/css" href="https://htmlwiki.ru/css/website.css">
href
Определяет URL адрес ресурса.
"https://htmlwiki.ru/css/website.css"
Вы можете передать абсолютный URL адрес.
"/css/website.css"
Вы можете передать адрес относительный корневому домену.
rel
Определяет тип ссылки, показывая как ссылка относится к текущей веб-странице.
"stylesheet"
Ресурс по ссылке это стили.
"icon"
Ссылка на favicon.
"author"
Ссылка указывает на сайт автора текущей веб-страницы.
"next"
Ссылка указывает на следующую страницу.
type
Определяет тип связанного ресурса.
"text/css"
Ссылка на CSS.
"text/html"
Ссылка на HTML страницу.
# meta
Определяет метаданные, прикрепленные к веб-странице.
Пример: Скопировать
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#ffffff">
Пример: Скопировать
<!-- Обновлять страницу каждые 5 секунд -->
<meta http-equiv="refresh" content="5">
Пример: Скопировать
<!-- Мгновенное перенаправление на https://cssreference.io -->
<meta http-equiv="refresh" content="0; url=https://cssreference.io">
charset
Определяет кодировку символов для всей веб-страницы.
"UTF-8"
Значение должно быть допустимым набором символов.
http-equiv
Определяет мета-правила для веб-страницы.
"Content-Security-Policy"
Определяет ссылку на политику содержания веб-страницы. .
"refresh"
Позволяет обновлять веб-страницу каждые N секунд или перенаправлять на другой URL.
"X-UA-Compatible"
Определяет, в какой версии Internet Explorer должна отображаться веб-страница..
name
Определяет дополнительную информацию, прикрепленную к веб-странице..
"viewport"
Определяет размеры и правила масштабирования для экрана.
"theme-color"
Определяет цвет темы, который может использоваться браузером или операционной системой..
content
Определяет содержимое метаданных. Это зависит от значения name
или http-equiv
.
"width=device-width, initial-scale=1"
Для метаданных viewport
можно указать ширину и исходный масштаб веб-страницы.
"2; url=https://cssreference.io"
Для метаданных refresh
можно указать, сколько секунд ждать перед перенаправлением на другой URL-адрес.
# script
Определяет контейнер для внешнего скрипта.
Пример: Скопировать
<script src="https://htmlwiki.ru/javascript/my-scripts.js"></script>
Пример: Скопировать
<script type="text/javascript">
console.log('Привет Мир');
</script>
src
Определяет источник внешнего скрипта.
"/javascript/my-scripts.js"
URL может быть относительным или абсолютным.
type
Определяет MIME тип внешнего скрипта.
"text/javascript"
Это для файлов .js
.
async
Позволяет асинхронно загружать внешний скрипт.
Значение не нужно.