Всем привет и для начала нашего знакомства с HTML давайте создадим папку для нашего проекта. И я назову её frontend_less и в ней создадим ещё одну папку под названием less_1 и далее в этой папке мы создаем ряд папок, а именно папку css-для хранения каскадных таблиц стилей следующую папку назовем js-для хранения скриптов и ещё две папки img-для хранения картинок и папку fonts-для хранения подключаемых шрифтов. И в итоге у нас получиться вот такая иерархия как внизу на фото:
Далее открываем нашу рабочую папку less_1 в редакторе кода я предпочитаю редактор Visual Studio Code если все сделали правильно то должно получиться так как на картинке ниже:
Теперь создаем в нашей рабочей папке файл под названием inex.html для этого достаточно кликнуть правой кнопкой мыши в рабочей области проекта в проводнике и выбрать пункт создать файл если все сделали правильно то то результат должен быть таким как показано ниже на фото:
На заметку! Почему файл называем inderx, а все потому что практически все сервера открывают файл именно с таким именем по умолчанию. Это означает главная страница.
И давайте напишем наш основной код страницы точнее базовый код ну или минимальный но в дальнейшем мы будем его увеличивать по мере роста наших знаний!
Ну и первым делом напишем первую строчку кода и укажем как браузеру стоит обрабатывать нашу страницу:
<!DOCTYPE html>
Далее открываем оболочку документа с единственным атрибутом где указываем язык содержимого:
<html lang="ru">
Далее внутри нашей оболочки создаем заголовок нашей страницы который является контейнером для других важных данных. Содержание его не отображается на странице:
<head>
Внутрь контейнера заголовка поместим тег title с содержимым нашего заголовка страницы в браузере:
<title>Урок №1. Знакомство с HTML</title>
Далее поместим meta тег с определением кодировки нашей страницы:
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
С заголовком мы закончили по этому закрываем наш контейнер head:
</head>
Далее открываем контейнер body отображаемое тело нашей страницы, все что будет внутри body будет видно в браузере отступаем немного места для нашего будущего кода и закрываем контейнер body, а так же нашу общую оболочку:
<body>
</body>
</html>