DevGang
Авторизоваться

HTML – то же самое, что и текстовый документ!

Язык программирования HTML используется для структурирования и отображения веб-страницы и её контента. Давайте более детально рассмотрим из каких блоков состоит код HTML.

Рассмотрим документ word:

Title: My First Document

Welcome to my Document!

This is a paragraph of text in my document. 
It's really quite an interesting paragraph, as paragraphs go. 
Here's a link to the OpenAI website for more interesting content: www.openai.com

Here is an image.
[IMAGE INSERTED]

Here is a list of my favorite fruits:
- Apples
- Oranges
- Bananas

Теперь переведем его на сайт, используя HTML

<!DOCTYPE html>
<html>
<head>
  <title>My First Document</title>
</head>
<body>
  <h1>Welcome to my Document!</h1>
  <p>This is a paragraph of text in my document. 
 It's really quite an interesting paragraph, as paragraphs go. 
Here's a link to the <a href="http://www.openai.com">OpenAI</a> website for more interesting content.</p>
  <img src="your-image-source.jpg" alt="An image in my document" />
  <p>Here is a list of my favorite fruits:</p>
  <ul>
    <li>Apples</li>
    <li>Oranges</li>
    <li>Bananas</li>
  </ul>
</body>
</html>

Считайте HTML-теги эквивалентом различных элементов в документе Word

Каждый _tag _ служит определенной цели и имеет определенное место отображения на веб-странице. Давайте разберемся в этом на нашем примере:

  • !DOCTYPE html: Эта строка необходима для объявления типа документа и версии HTML. В данном случае это HTML5.
  • html: Это корень HTML-документа. Все теги, которые используются для отображения чего-либо на веб-странице, находятся внутри этого тега.
  • head: Этот тег содержит такие элементы, как заголовок документа (который отображается как название вкладки в браузере), ссылки на таблицы стилей (CSS), объявление кодировки символов и многое другое. Важно отметить, что содержимое тега head не отображается на самой веб-странице при просмотре в браузере.
  • title: Этот тег вложен в тег и используется для задания заголовка веб-страницы.
  • body: В тег body помещается содержимое веб-страницы - это то, что видят пользователи при посещении вашей страницы.
  • h1: Этот тег используется для добавления заголовка верхнего уровня, который обычно является названием веб-страницы или заголовком раздела самого высокого уровня.
  • p: Это тег абзаца, который используется для обозначения текстовых абзацев.
  • OpenAI: Этот тег создает гиперссылку. Текст между открывающим и закрывающим тегами - это текст, который будет отображаться в виде ссылки на веб-странице. В атрибуте href указывается URL страницы, на которую вы хотите сослаться.
  • img: Этот тег используется для вставки изображений в веб-страницу. Источник изображения (src) указывает на местоположение файла изображения, а атрибут alt содержит альтернативный текст для изображения, если оно не может быть отображено.
  • ul и li: Эти теги используются для создания неупорядоченных (маркированных) списков. Тег ul обозначает начало списка, а каждый элемент списка оборачивается тегом li.

Базовые уроки по HTML можете найти у нас на сайте базовая структура, создание форм или изучить их на канале.

Источник:

#Начинающим #HTML
Комментарии
Чтобы оставить комментарий, необходимо авторизоваться

Присоединяйся в тусовку

В этом месте могла бы быть ваша реклама

Разместить рекламу