Основы HTML

Содержание

Слайд 2

HTML-документ — это обычный текстовый документ, может быть создан как в

HTML-документ — это обычный текстовый документ, может быть создан как в

обычном текстовом редакторе (Блокнот), так и в специализированном, с подсветкой кода (Notepad++, Visual Studio Code и т.п.). HTML-документ имеет расширение .html
HTML-документ состоит из дерева HTML-элементов и текста. Каждый элемент обозначается в исходном документе начальным (открывающим) и конечным (закрывающим) тегом (за редким исключением).
Начальный тег показывает, где начинается элемент, конечный — где заканчивается. Закрывающий тег образуется путем добавления слэша / перед именем тега: <имя тега>…. Между начальным и закрывающим тегами находится содержимое тега — контент.
Одиночные теги не могут хранить в себе содержимого напрямую, оно прописывается как значение атрибута, например, тег создаст кнопку с текстом Кнопка внутри.
Слайд 3

Теги могут вкладываться друг в друга, например, Текст . При вложении

Теги могут вкладываться друг в друга, например,

Текст

. При вложении следует

соблюдать порядок их закрытия (принцип «матрёшки»), например, следующая запись будет неверной:

Текст

.
Каждому элементу можно присвоить несколько значений class и только одно значение id. Множественные значения class записываются через пробел,
. Значения class и id должны состоять только из букв, цифр, дефисов и нижних подчеркиваний и должны начинаться только с букв или цифр.
Браузер просматривает (интерпретирует) HTML-документ, выстраивая его структуру (DOM) и отображая ее в соответствии с инструкциями, включенными в этот файл (таблицы стилей, скрипты). Если разметка правильная, то в окне браузера будет отображена HTML-страница, содержащая HTML-элементы — заголовки, таблицы, изображения и т.д.
Слайд 4

HTML-документ состоит из двух разделов — заголовка — между тегами …

HTML-документ состоит из двух разделов — заголовка — между тегами …

и содержательной части — между тегами ….




...






Слайд 5

Элементы, находящиеся внутри тега , образуют дерево документа, так называемую объектную

Элементы, находящиеся внутри тега , образуют дерево документа, так называемую объектную

модель документа, DOM (document object model). При этом элемент является корневым элементом.
Слайд 6

Элемент Обязательным тегом раздела является тег . Текст, размещенный внутри этого

Элемент <br><p>Обязательным тегом раздела <head> является тег <title>. Текст, размещенный внутри</div></h2><div class="slides-content">этого тега, отображается в строке заголовка веб-браузера. Длина заголовка должна быть не более 60 символов, чтобы полностью поместиться в заголовке. Текст заголовка должен содержать максимально полное описание содержимого веб-страницы.<br><html><br> <head><br> <title>Привет, Лиза!


Слайд 7

Элемент Необязательным тегом раздела является одинарный тег . С его помощью

Элемент

Необязательным тегом раздела является одинарный тег . С его

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


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




Слайд 8

HTML - теги HTML-теги — основа языка HTML. Теги используются для

HTML - теги

HTML-теги — основа языка HTML. Теги используются для разграничения

начала и конца элементов в разметке.
Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается начальным (открывающим) и конечным (закрывающим) тегом. Открывающий и закрывающий теги содержат имя тега.
Все HTML-элементы делятся на пять типов:
пустые элементы — , ,
, , ,
, , , , , , , , , ;
элементы с неформатированным текстом —