Учебник html в html: Самоучитель HTML4 | htmlbook.ru

Есть два типа списков, которые могут быть включены на веб-страницу: упорядоченный и неупорядоченный .
Неупорядоченный список

определяется маркерами, в то время как упорядоченный список
использует нумерованную последовательность.

Давайте создадим новый

, а затем перечислим причины, по которым мы любим сов:

  
 Почему я так люблю сов? 

  
 они очаровательны 
  
 и прекрасно 
  
 и приятно 

  

Что бы вы изменили, если бы вы хотели сделать этот список неупорядоченным? Как вы могли проверить, что это работает? Попробуйте, а затем снова измените свой список на упорядоченный.

Элемент: Image

На данный момент мы многое узнали о том, как добавлять текст на нашу страницу. А теперь давайте добавим изображения!

Прежде чем мы начнем, нам нужно добавить файлы изображений, которые мы хотим использовать, в папку проекта. Очень важно хранить изображения в отдельной папке, поэтому сначала создайте папку под названием «изображения» внутри той же папки, что и ваш HTML-файл. Затем загрузите нужные изображения. Для этого щелкните правой кнопкой мыши каждую из следующих ссылок, выберите «Сохранить ссылку как…» и сохраните ее в только что созданной папке изображений:

Изображения в основном состоят из трех атрибутов

• тег
• атрибут src , который позволяет странице узнать, какое изображение мы хотим просмотреть
• атрибут alt , он предоставляет дополнительную информацию, если изображение не отображается на веб-странице по какой-либо причине

Для того, чтобы увидеть это изображение на веб-странице, нам необходимо установить ссылку на изображение, это включает в себя указание веб-странице, где оно находится и как оно называется.Перед основным заголовком страницы добавьте следующий

Здесь вы можете видеть, что мы указали src изображения искать в папке изображений и отображать изображение logo.png , затем мы присвоили ему соответствующий атрибут alt .

Давайте добавим еще несколько изображений. На этот раз мы внесем их в список.

Сделайте это под заголовком

Почему я так люблю сов?

.

Добавление ссылки на несколько элементов

Ссылки могут содержать множество элементов, а не только текст.

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

Добавьте это под упорядоченным списком о том, почему мы любим сов.

  

  
    
    
    

    Смотреть видео
  

  

Щелкните любое изображение. Можете ли вы перейти на страницу ссылки?
Что будет, если вынуть метку
? Не забудьте потом вернуть его обратно!

Форматирование текста

Мы также можем выделить или сделать текст важным .Для выделения мы используем и для важности

Выделим часть содержания вашего пункта

.

  

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

  

Специальные символы и другое форматирование

Некоторые символы имеют особое значение в HTML.Например, мы используем < и > для создания HTML-тегов, и мы используем «для обертывания наших атрибутов. Но что, если мы захотим использовать эти символы на нашей странице?

Один из способов - использовать HTML-сущностей . Они состоят из амперсанда, имени и точки с запятой. Вот HTML-код символа кавычки: & quot; .

Вы также можете использовать числовой формат для создания специальных символов. Вот список некоторых распространенных сущностей.

Добавьте небольшую рифму на свою страницу, в которой в первом предложении говорится «Сова и кошечка» вместо «Сова и кошечка», используя элементы HTML для амперсанда: & amp; .

  

  

    
       "Сова и Кошечка вышли в море 

        В красивой горохово-зеленой лодке »
    
  
   & mdash; детские стишки 

  

- еще один элемент форматирования HTML, который вы можете использовать.

Вы заметили, как персонаж & mdash; рендеров на странице?

ссылок mailto

Links также может открывать почтовый клиент пользователя и обмениваться контентом.Разница между ссылками и ссылками mailto заключается в содержании, определенном в атрибуте href .

  

  

      Напишите нам 
  
  

      Отправить другу по электронной почте 
  

  

Что происходит, когда вы нажимаете первую ссылку?

Что происходит, когда вы нажимаете вторую ссылку? Чем он отличается?

Что произойдет, если вы добавите & body = Owls% 20are% 20amazing ко второй ссылке?

Обратите внимание, что замена пробелов в тексте темы на % 20 не является обязательной, но обеспечивает сохранение пробелов при открытии ссылки в ряде как новых, так и старых почтовых клиентов / программного обеспечения.

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

Бонус

Поделиться в Twitter

Добавьте ссылку для общего доступа в Twitter вместе с другими ссылками для общего доступа.

   Поделитесь своей любовью к совам в твиттере 
  

---

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

Дополнительная литература

Вернуться к обучающим материалам
главная страница кодовой панели

Изучите HTML

Вот бесплатное руководство по HTML, которое научит вас HTML (язык гипертекстовой разметки), чтобы шаг за шагом приступить к созданию вашего веб-сайта. Вы можете найти все, что связано с HTML, проиллюстрированное с примерами для каждой главы отдельно, чтобы помочь вам полностью понять язык разметки.

HTML, аббревиатура от HyperText Markup Language, является основным языком разметки для создания веб-сайтов. Он состоит из серии кодов, используемых для структурирования текстов, изображений и другого контента, отображаемого в браузере.

Наша книга HTML состоит из нескольких разделов, в которых содержится вся необходимая информация для обогащения ваших знаний о HMTL.

Основы HTML

В разделе «Основы HTML» вы получите полное представление о редакторах и инструментах, которые вам понадобятся при создании веб-страниц.Он проинформирует вас о профессиональных редакторах, которые веб-разработчики используют для кодирования.

Элементы - это основа HTML. Каждый документ HTML состоит из элементов, которые определяются с помощью тегов. HTML Elements обучает вас типам HTML-элементов. Он также подчеркивает разницу между тегами HTML и элементами HTML, которые часто путают.

HTML-теги Basic используются для структурирования содержимого веб-сайта (текста, гиперссылок, изображений, мультимедиа и т. Д.). Теги только «инструктируют» браузеры, как отображать содержимое веб-страницы.В главе «HTML-теги» предлагаются наиболее часто используемые теги в HTML с их примерами.

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

Сложная глава «Форматирование HTML» позволяет изучить категории тегов форматирования с кратким описанием и примерами.

Веб-сайты содержат различные типы ссылок, которые ведут вас прямо на другие страницы или позволяют перейти к определенной части страницы.Узнайте, как определить гиперссылки в главе «Ссылки HTML» и как использовать различные атрибуты со ссылками и как применять ссылки к изображению.

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

В разделе «Таблицы HTML» предлагается список устаревших атрибутов, что означает, что они больше не используются в упомянутых тегах и заменены другими альтернативными атрибутами.

В разделе «Сценарии HTML» описывается способ встраивания скрипта или ссылки на исполняемый скрипт в HTML-документ и запуск скриптов.

HTML-шаблоны

В этой части книги представлена ​​коллекция шаблонов макета HTML и шаблонов форм, в которых представлены основные макеты веб-сайтов и различные виды форм, созданные с использованием только HTML и CSS.

HTML 5 включает введение в HTML, а также предлагает основные преимущества и модели содержимого.Каждая из этих моделей описывает тип содержащихся в ней элементов. Вы также можете найти список тегов HTML5 с их описаниями и семантическими элементами, представленными с примерами. HTML5 позволяет встраивать аудиофайлы без подключения сторонних плагинов.

Ссылки HTML

В этой части предлагаются наборы символов, необходимые для правильного отображения HTML-страницы. Вы можете найти печатные символы ASCII с их эквивалентными кодами объектов HTML, символы ISO 8859-1, символы, список кодов символов UTF-8, набор символьных объектов, математические символы, греческие буквы с их номерами объектов и именами.В главе также рассматриваются методы HTTP, сообщения о состоянии HTTP, таблица типов MIME и таблица тегов HTML, разделенных на категории. Другая глава HTML-изображений содержит необходимые и рекомендуемые атрибуты изображений, плавающие изображения и современные форматы изображений на выбор. На странице XHTML вы получите представление о преимуществах и различиях между HTML и XHTML.

HTML-теги

HTML-теги представляют собой самый большой раздел со всеми тегами HTML, включая устаревшие. В главе «Устаревшие теги» вы прочитаете о наборе устаревших тегов HTML с их альтернативными предложениями.Две другие главы включают Глобальные атрибуты HTML и Атрибуты событий, где вы можете найти все, что связано с этими темами.

На нашем веб-сайте вы можете найти редактор HTML, в котором вы можете редактировать HTML-код, и нажмите «Отправить», чтобы увидеть результат.

HTML не так уж и сложен, поэтому мы уверены, что вам понравится учиться. После успешного завершения книги HTML перед вами встанет вызов!

Проверьте себя с помощью этой базовой викторины HTML и узнайте, сколько вы узнали.

Начни обучение прямо сейчас!

HTML Учебник

	Гиперссылка на URL-адрес или цель в документе HTML
	Определяет аббревиатуру или акроним
<аббревиатура>	Определяет аббревиатуру
<адрес>	Контактная информация ближайшего предка или
<зона	Определяет интерактивную область ( или горячую точку ) внутри карты изображений
<статья>	Автономная композиция (HTML5)
<сторона>	Раздел, непосредственно связанный с окружающим его контентом (HTML5)
	Придает тексту жирный вид (без смыслового значения)
<большой>	Определяет текст на один размер больше (устарело в HTML5)
	Определяет котировку длинного блока из другого источника
	Основная часть документа, отображаемая на веб-странице
	разрыв строки
<кнопка>	Нажимная кнопка
<холст>	Контейнер, используемый для рисования графики в документе
<заголовок>	Название таблицы
<центр>	Центрирует текст по горизонтали
	Определяет название творческой работы
<код>	Фрагмент компьютерного кода
Определяет свойства для столбца
Группирует набор столбцов в таблице
	Определяет список предлагаемых значений для
	Определяет описание (для термина) в списке описаний
	Текст разметки, который был удален из документа, но оставлен для отображения истории изменений
	Обозначает термин, который определяется
	Универсальный контейнер
	Определяет список описания
	Определяет термин в списке описания
	Обозначает текст с ударением
<вставка>	Используется как контейнер для встраивания внешнего содержимого
	Используется для группировки связанных элементов в форме HTML
	Определяет размер шрифта, цвет и начертание текста
<нижний колонтитул>	Нижний колонтитул (HTML5)
<форма>	Создает форму на веб-странице, которая имеет интерактивные элементы управления для пользовательского ввода
	Заголовок 1 (высший уровень и самый важный)
	Заголовок 2 (второй уровень)
	Заголовок 3 (третий уровень)
	Заголовок 4 (четвертый уровень)
	Заголовок 5 (пятый уровень)
	Заголовок 6 (шестой уровень и наименее важный)
<заголовок>	Заголовок (HTML5)
	Тематический разрыв в HTML5, горизонтальная линия в HTML 4.01
	Выделение текста курсивом (без семантического значения)
<кадр>	Вставить другую HTML-страницу в текущую страницу
	Изображение
<вход>	Интерактивное управление вводом данных
	Текст разметки, который был вставлен в документ для отображения истории изменений
	Определяет текст как вводимый пользователем с клавиатуры
<метка>	Создает заголовок для пользовательского ввода
<легенда>	Создает заголовок для
	Элемент списка для , или
<основной>	Определяет основное содержимое документа (HTML5)
<карта>	Определяет карту изображений с интерактивными областями
<отметка>	Отмечает или выделяет текст, который представляет особый интерес или имеет отношение к делу
<выделение>	Определяет область прокручиваемого текста
<меню>	Неупорядоченный список меню (не реализовано в браузерах)
	Раздел с навигационными ссылками (HTML5)
	Альтернативный HTML, если тип сценария не поддерживается или сценарии отключены в браузере
<объект>	Используется как контейнер для встраивания внешнего ресурса
	Заказанный список
	Создает группу опций в раскрывающемся списке
<опция>	создает элемент в ,
	пункт
	Предварительно отформатированный текст с сохранением пробелов и разрывов строк
	Определяет короткую встроенную цитату из другого источника
	Придает тексту зачеркнутый вид
<сценарий>	Встроить скрипт клиентского сервера или сослаться на него
<раздел>	Общий раздел (HTML5)
<выбрать>	Создает раскрывающийся список значений
<маленький>	Определяет текст на один размер меньше
	Стандартный встроенный контейнер
<удар>	Придает тексту зачеркнутый вид
	Придает тексту сильный акцент
<стиль>	Встраивает CSS в документ HTML
	Определяет нижний индекс
	Определяет надстрочный текст
<таблица>	Стол
Определяет набор строк, составляющих тело таблицы
		Стандартная ячейка в таблице
<фут>	Определяет набор строк, составляющих нижний колонтитул таблицы
		Ячейка заголовка в таблице
Определяет набор строк, составляющих заголовки столбцов в таблице
<время>	Значение времени в 24-часовом формате или дата в григорианском календаре (HTML5)
Строка в таблице
	Определяет текст, который должен иметь другой стиль или иметь нетекстовую аннотацию.
	Неупорядоченный список

HTML для детей Глава 1 Что такое HTML в любом случае

Что такое HTML?

HTML означает язык разметки гипертекста.HTML - это «скрытый» код, разработанный ученым Тимом Бернерсом- Ли в 1990 году, который помогает нам общаться с другими людьми во всемирной паутине (WWW).

При написании HTML вы добавляете к тексту «теги», чтобы создать структуру. Эти теги сообщают браузеру, как отображать текст или графику в документе. Например, следующий документ имеет простой макет (структуру). Обратите внимание, что есть три основных части: заголовок, два абзаца и маркированный список.

Текстовые редакторы

Чтобы добиться аналогичного макета в браузере, вы используете текстовый редактор.Здесь вы размещаете весь свой код и контент. Для ПК это Блокнот; для MAC это TextEdit.

Ниже код (зеленый) и текст для этой страницы.








Почему я люблю купаться летом.




Плавание - мое самое любимое занятие летом. Когда светит солнце и воздух теплый, вы обнаружите, что я ныряю в бассейн на заднем дворе.Бассейн не впечатляющий, глубиной всего три фута, но он мой.




Я люблю плавать по трем причинам:





• Я много тренируюсь < / li>
  
• Я наслаждаюсь свободой


• У меня есть возможность побыть на солнце.






Вот как это выглядит в редакторе Блокнота:

А вот и получившаяся страница в браузере.

Заметили, что в браузере пропали теги? Это потому, что теги сообщают браузеру, как отображать файлы, но не отображаются сами по себе.

Синтаксис: новое слово для изучения

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

Компьютерный язык немного отличается.Согласно Ванги Бил из Webopedia, синтаксис:

«Относится к орфографии и грамматике языка программирования. Компьютеры - это негибкие машины, которые понимают, что вы набираете, только если вы набираете его в точной форме, которую ожидает компьютер. Ожидаемая форма называется синтаксисом ».

Вы будете часто видеть это слово. Важно точно соблюдать синтаксис (то, как написан код), иначе ваш браузер не будет отображать вашу страницу должным образом.

Перейти к главе 2: Основные понятия

Заявление о конфиденциальности
Изучение HTML для детей
© 1999- 2015 by Jill Jeffers Goodell

Содержание



Публикация файлов организационного режима в HTML

В этом руководстве мы будем предполагать, что все наши файлы в организационном режиме находятся под ~ / org / , и мы публикуем их по адресу ~ / public_html / .

Предположим далее, что вы уже знакомы с основами создания заметок в org и может добавить немного контента в файлы Org-mode, которые мы добавляем в наш проект. во время этого урока. Добавьте хотя бы один заголовок к каждому из файлов.

Первое, что нужно сделать, это создать папку ~ / org . Здесь наши заметки файлы живут. Внутри ~ / org / у нас есть папка css / для таблиц стилей и скрипты и папку с именем img / (угадайте, что там внутри).

Первый файл, который мы добавляем в эту папку (а позже и в подкаталоги), называется index.org . Это имя было выбрано, поскольку организация опубликует файлы для с базовым именем исходного файла и расширением .html ^{. Таким образом ~ / org / index.org когда-то будет ~ / public_html / index.html - стартовой страницей.}

Давайте добавим еще один файл и назовем его ~ / org / Remember.org . После добавления таблица стилей ~ / org / выглядит так:

~ / org /
   | - css /
   | `- таблица стилей.css
   | - img /
   | - index.org
   `- Remember.org
 

Когда вы когда-нибудь захотите добавить ссылку на файл, сделайте это обычным способом. Чтобы связать с
index.org с по Remember.org , просто напишите

[[файл: запомнить.org] [запомнить]]
 

Org преобразует эти ссылки в HTML-ссылки при экспорте:

 помните 
 

То же самое и с изображениями. Чтобы добавить изображение, поместите его в ~ / org / img / test.jpg и
обратитесь к нему

[[файл: img / test.jpg]]
 

Вы можете проверить свои ссылки, щелкнув по ним. Чтобы проверить ссылки на изображения, вы также можете
попробуйте включить iimage-mode ^{, который здесь работает без проблем.}

При желании настройте таблицу стилей, как показано в разделе Специальный комментарий.
раздел. Однако рекомендуется использовать настоящую таблицу стилей.

HTML Tutorial: Angular 7/8 Template Syntax - Interpolation, ngFor & ngIf Directives

В этом руководстве мы научим вас HTML, который используется в качестве языка шаблонов для Angular.Мы создадим простое «приложение» HTML с использованием подхода JAMStack и узнаем о расширенных концепциях Angular (таких как привязка данных, интерполяция, циклы с директивой ngFor и условный рендеринг с директивой ngIf ). HTML является необходимым условием любой веб-разработки и одним из трех столпов Интернета наряду с JavaScript (или скомпилированным TypeScript) и CSS.

Примечание : HTML - это язык шаблонов Angular

Что такое HTML?

HTML означает HyperText Markup Language - это искусственный язык разметки, который может использоваться программистами для создания структуры веб-документов.Это один из трех столпов Интернета наряду с JavaScript и CSS. Его может интерпретировать веб-браузер, который преобразует исходный код HTML, состоящий из тегов HTML, в реальную веб-страницу с текстом, таблицами, формами, ссылками и т. Д.

Как Angular использует HTML?

Веб-браузер может понимать только простой HTML, JavaScript и CSS. Хотя Angular использует HTML для создания представлений, он добавляет некоторые структуры шаблонов, такие как циклы и условные директивы, а также другие синтаксические символы для интерполяции переменных и привязки данных, которые не являются частью HTML, поэтому они скомпилированы заранее и преобразуются в простой HTML.

Приложение Angular выполняется, когда браузеру передается типичный файл index.html :

Пакеты JavaScript для Angular создаются и вставляются в файл index.html после сборки приложения.

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

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

Например, корневой компонент в приложении Angular, созданном с помощью официального интерфейса командной строки Angular, имеет связанный шаблон с именем app.component.html . Это не соглашение, поскольку мы должны явно указать компоненту, где найти шаблон.Это делается с помощью метасвойства templateUrl следующим образом:

  import {Component} from '@ angular / core';

@Составная часть({
  селектор: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Angular Demo';
}
  

Мы также можем использовать встроенный HTML-шаблон, используя свойство template .

Примечание : теги , и не имеют полезной роли в шаблонах Angular.

Синтаксис шаблона Angular

В шаблонах Angular вы можете использовать не только простой HTML, но и специальный синтаксис и директивы, которые позволяют вам воспользоваться всеми преимуществами функций Angular, таких как интерполяция, привязка, ngClass, ngStyle, ngFor и ngIf, и т. д.

Интерполяция

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

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

Например, в предыдущем компоненте App у нас есть переменная title с начальным значением Angular Demo . Мы можем использовать интерполяцию для отображения этого значения в соответствующем шаблоне app.component.html :

Angular будет динамически заменять переменную заголовка ее значением в шаблоне.

Примечание : Вы можете изменить разделитель интерполяции по умолчанию, используемый Angular, используя свойство интерполяции в метаданных компонента.

Angular Встроенные директивы: ngFor и ngIf

Angular предоставляет множество встроенных директив, таких как ngFor для перебора массивов данных и ngIf для условного рендеринга HTML-элементов.

Директива ngFor позволяет вам перебирать массивы в ваших HTML-шаблонах, а ngIf позволяет вам выражать условия в вашем шаблоне. Это мощные программные конструкции, расширяющие HTML благодаря Angular.

Ниже мы увидим, как использовать ngFor и ngIf на практическом примере.

Расширение HTML с помощью компонентов и директив Angular

Angular позволяет расширять словарь HTML ваших шаблонов с помощью компонентов и директив, которые можно рассматривать как новые элементы и атрибуты.

Что такое HTML-документ?

HTML-документ - это просто текстовый документ с расширением .html вместо .txt

Большинство тегов имеют открывающую и закрывающую части. Каждый тег начинается с символа < и заканчивается символом > . Например:

• Самый верхний тег, определяющий документ HTML, - . Все содержимое должно находиться между открывающим и закрывающим тегами.
• Тег тела, определяющий тело веб-страницы, - .
• Тег для добавления заголовка страницы: .и т. д.

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

Веб-серверы обслуживают веб-браузеры только простой HTML без каких-либо серверных программных конструкций.

HTML - важное требование, если вы хотите создавать веб-сайты. Большинство разработчиков начинают свой путь в веб-разработке с изучения HTML, это касается как фронтенд-разработчиков, которые используют JavaScript для создания клиентских приложений, так и бэкэнд-разработчиков, которые используют серверные языки, такие как PHP или Python, для создания веб-приложений.

Примечания : Вы также можете использовать фреймворки JavaScript, такие как Angular, или библиотеки, такие как React или Vue, для создания приложений с JS и HTML. Все эти инструменты используют компоненты, которые используют HTML в качестве языка шаблонов для создания представлений.

Вы можете расширять HTML, создавая новые теги, используя пользовательские элементы и веб-компоненты, которые представляют собой стандартные технологии браузера, не требующие сторонних инструментов, фреймворков или библиотек для интерпретации браузером.

Предварительные требования

Чтобы начать изучение HTML, вам не нужна полноценная среда разработки с множеством установленных инструментов.Вам понадобится только текстовый редактор (который может иметь подсветку синтаксиса для HTML) и веб-браузер, например Chrome, Firefox или даже IE.

Вам также потребуются некоторые базовые знания для работы с вашей операционной системой, Windows, Linux или macOS, в частности, как создавать и открывать файлы.

Вы также можете использовать среды онлайн-разработки, такие как CodePen, JSBin или JSFiddle, для тестирования HTML без создания файлов на вашем компьютере. На самом деле, эти онлайн-среды наиболее полезны, если вы не можете создавать файлы в своей системе или используете такие устройства, как телефоны и планшеты, когда изучаете HTML, JavaScript или CSS.

В этом руководстве я предполагаю, что вы работаете с терминалом на основе Unix (присутствует в macOS или Linux) и может быть установлен в Windows. Не волнуйтесь, мы будем использовать команду для перехода к рабочей папке и создания файла, вы можете сделать это по своему усмотрению.

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

Примечание : язык программирования имеет расширенные конструкции и функции, такие как циклы для перебора массивов данных и условные операторы для принятия решений и т. Д. HTML не имеет этих конструкций, поэтому его нельзя рассматривать как язык программирования, поскольку Он просто отображает и форматирует визуальные элементы на веб-странице.

Многие языки шаблонов построены на основе HTML, чтобы предоставить эти конструкции.Например, Angular предоставляет синтаксис шаблона, который включает привязку данных, такую ​​как интерполяция, для простого обновления страницы данными из родительского компонента, а также такие директивы, как * ngFor и * ngIf для перебора данных и условного отображения элементов HTML.

Создание самого простого HTML-документа

Откройте терминал и выполните следующие команды:

  $ cd ~
$ mkdir моя первая веб-страница
$ cd моя-первая-веб-страница
$ touch index.html
  

Мы просто переходим в домашнюю папку. Затем мы создаем папку с именем my-first-webpage . Затем мы переходим в него и создаем файл index.html .

Теперь используйте текстовый редактор (например, Vim или любой другой) и откройте файл index.html . Затем просто добавьте следующий код:

  

  
    
  
  
    
 Это моя первая веб-страница 
  

  

Сначала мы добавляем doctype, который должен присутствовать.В настоящее время в современных браузерах, которые понимают HTML5, это в основном бесполезно, но необходимо. Раньше он использовался для связи с некоторыми документами определения типов, которые содержали синтаксические правила языка.

Согласно Википедии, это определение типа документа:

Объявление типа документа или DOCTYPE - это инструкция, которая связывает конкретный SGML (например, веб-страницу) с определением типа документа ( DTD) (например, формальное определение конкретной версии HTML 2.0 - 4.0) или XML-документ. В сериализованной форме документа он проявляется как короткая строка разметки, которая соответствует определенному синтаксису.

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

Затем мы добавляем раздел заголовка документа с помощью тегов и : [] (https: // developer.mozilla.org/en-US/docs/Web/HTML/Element/head) элемент является своего рода контейнером для всех тегов, которые представляют некоторую информацию о вашем документе, например заголовок, который добавляется с помощью