Урок №2. HTML. Введення

Курс по основам HTML | CSS. W3Schools українською. Уроки для початківців



Що таке HTML?

HTML є стандартною мовою розмітки для створення веб-сторінок.


Простий HTML документ

Приклад:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>
Спробуйте самі! »

Пояснення прикладу:


Теги HTML

HTML-теги - це назви елементів, оточені кутовими дужками:

<назва тегу>Тут йде зміст...</назва тегу>

Примітка: Початковий тег також називається - відкриваючим тегом, а кінцевий тег - закриваючим тегом.


Веб-браузери

Метою веб-браузера (Chrome, Firefox, Opera, Internet Explorer, Safari) є читання документів HTML та їх відображення. Браузер не відображає теги HTML, але використовує їх, щоб визначити, як відобразити веб-сторінку:

Отображение HTML-страницы в браузере
Відображення HTML-сторінки в браузері

Структура сторінки HTML

Нижче наведено візуалізацію структури HTML-сторінки:

<html>
<head>
<title>Назва сторінки</title>
</head>
<body>
<h1>Це заголовок</h1>
<p>Це параграф.</p>
<p>Це другий параграф.</p>
</body>
</html>

Примітка: У браузері відображається лише вміст у розділі <body>.


Об'ява <!DOCTYPE>

Об'ява <!DOCTYPE> являє собою визначення типу документа і допомагає браузерам правильно відображати веб-сторінки. Вона повинна з'являтися тільки один раз у верхній частині сторінки (перед будь-якими тегами HTML).

Об’ява <!DOCTYPE> не чутлива до регістру.

Об’ява <!DOCTYPE> для HTML5 вигляде так:

<!DOCTYPE html>

Версії HTML

З перших днів існування Інтернету було багато версій HTML:

Версія Рік появи
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014


warning

Не викладайте свій код безпосередньо в коментарях, він відображається некоректно. Скористайтесь такими сервісами, як jsfiddle.net, codepen.io, liveweave.com, jsbin.com, збережіть код на будь-якому з цих сервісів і в коментарях дайте на нього посилання. Так буде видно і код, і результат.