Що таке HTML?
З англійської це переводиться як мова розмітки гіпертексту. Вона допомагає упорядувачити сторінку, вона інформує комп'ютер, що має бути на сторінці. Це трохи як гардероб: має стіни - кордони коду, за межами яких нічого не пишеться; верхню та нижня полиці - місте для загальних інформацій о документі та місце для завартісті. А також маленьки контейнери з різними речами:текстом, картинками і так далі.
Кожен із цих елементів складається з двох тегів:
початкового <>
та закриття </>
У середину можна додати ще один тег або щось інше, на приклад якщо ми скористаємось з тегу: <p> якийсь там текст </p> , то усередині можна додати текст.
Браво! Ти вже знаєш один тег, час пізнати декілька наступних.
Як збудувати сторінку:
На початку створюємо коробку стін гардероба:
<!DOCTYPE html>
</html>
Це єдиний тег, у якому відкриття і зачинення різні. У інших випадках вони ідентичні, так як нижче:
<div></div>
<h3></h3>
Потім додаємо верхню полицю:
<head>
вміст
</head>
Її додаємо після відчинення тегу документу, от так:
<!DOCTYPE html>
<head>
вміст
</head>
</html>
Тепер час на нижню полицю:
<body>
вміст
</body>
Її додаємо після зачинення верхньої полиці, от так:
<!DOCTYPE html><head>
вміст
</head>
<body>
вміст
</body>
</html>
Такий код це база. Але така сторінка нічого не покаже, тому що це шаблон, рамки, у які можна вложити вміст: текст, та фотографії. Усе це додається до боді. Зробити це можна за допомогою відповідніх тегів:
Щоб вмістити титул, можна скористатися з <h1> :
<h1>Lorem Ipsum є псевдо- латинський текст використовується у веб - дизайні, типографіка, верстка, і друку замість англійської підкреслити елементи дизайну над змістом.</h1>
Щоб додати звичайний текст, можна скористатися з <p>:
<p> це примірний текст вписаний між двома тегами </p>
Щоб додати фотографіі, треба скористатися цією конструкцією:
<img src="Адреса URL фотографіі"></img>