Введение в HTML: глобальная структура: часть 1

Ранее мы углубились в историю HTML. Сегодня мы узнаем о глобальной структуре HTML-страницы, которая будет содержать наш контент.

Как бы вы ни поняли, что такое HTML, пришло время узнать о некоторых HTML-тегах. Если вы все еще хотите пойти в обход, нажмите здесь.

Здесь мы собираемся узнать о тегах, которые имеют дело с глобальной структурой HTML-документов.

Теперь здесь у меня открыт браузер Google Chrome, но вы можете использовать любой браузер, в котором вам удобно, и здесь мы создадим новый HTML-документ в текстовом редакторе. Я использую Sublime Text для кодирования своих HTML-файлов, но вы можете использовать любой текстовый редактор, который вам нравится, существует множество текстовых редакторов, некоторые из которых перечислены ниже, загрузите совместимую версию текстового редактора, который вам нравится.

  1. "Атом"
  2. Visual Studio Code (мой личный фаворит)
  3. "Скобки"
  4. Возвышенный

Теперь сначала мы создадим то, что называется типом документа, и для этого мы продолжим и откроем теги HTML, поставим внутри восклицательный знак, напечатаем слово «тип документа», за которым следует экран. , а затем буквы HTML. Это то, что называется типом документа.

теперь существует множество различных типов документов для создания различных типов HTML-документов. Однако этот тип документа называется типом документа HTML5. Здесь я буду говорить о тегах HTML4, но эти теги HTML4 все еще можно использовать с HTML5.

Итак, теперь продолжайте и сохраните документ как «index.html». Почему «index.html»? Имя файла index.html очень распространено, и когда вы называете что-то idex.html и помещаете его в папку на веб-сервере, веб-сервер обычно направляет непосредственно на index.html и обходит любые другие имена файлов. Мы рассмотрим файловую структуру чуть позже, а пока давайте перейдем к HTML-тегу.

Итак, теперь просто немного пропустим здесь и наберем ‹HTML›(HTML-тег) и внутри тега мы будем использовать то, что называется "атрибутом". Поэтому мы напечатаем слово lang для языка, знак равенства («=») и в кавычках поместим «en» для английского языка. Теперь закройте тег HTML. Тег HTML оборачивает весь документ, и именно туда мы будем помещать все остальные наши теги. Мы использовали атрибут языка, чтобы указать язык страницы, в данном случае это будет английский. Опять же, HTML-тег будет обертывать все остальные ваши теги на вашей странице, но объявление doctype всегда должно быть написано вне HTML-тега и всегда должно стоять первым, это очень специальный тег. обратитесь к изображению ниже.

Далее мы добавим метатег.

Итак, мы напечатаем слово мета и снова будем использовать атрибут. В этом случае мы собираемся использовать атрибут "charset", за которым следует знак "=", затем двойные кавычки, и мы продолжим и введите "utf-8". Набор символов означает набор символов, и в этом случае мы используем набор символов"utf-8", и это набор символов, который вы хотите использовать 99% времени, когда вы создаете веб-сайты. см. приведенный ниже код.

Если вы используете другой набор символов, у вас, вероятно, есть очень конкретная причина для этого, и вы, вероятно, знаете, почему. Метаинформация о наборе символов является опцией, но, как и при выборе английского языка, рекомендуется ее включить. Так что мы продолжим и сохраним это.

Вы заметите, что метатег очень похож на тег doctype в том смысле, что у него нет закрывающего тега для сопряжения с ним. Это потому, что метатег — это то, что называется «пустым элементом». Здесь нет закрывающего тега, потому что внутри метатега нечего помещать. Контент и теги одинаковые

Мы рассмотрели большую часть тегов, которые нам понадобятся для создания нашей глобальной структуры страницы, но осталось изучить еще несколько. Мы закончим начатое в следующем, а пока Счастливого обучения…!!!