{
font-size: 16px;
}

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

Селектор идентификаторов:

Селектор классов:

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

Каждое правило CSS имеет две основные части:
селектор (до знака “{“)
блок объявлений (внутри { })

и распознаются стили, формируется CSSOM (CSS Object Model).
На основе DOM и CSSOM формируется дерево рендеринга (Render tree) — полный набор объектов рендеринга.
Для каждого элемента Render tree рассчитывается положение на странице — происходит layout. Браузеры используют поточный метод (flow).
Наконец, происходит отрисовка всего этого в браузере — painting.
Автоисправление

Используется для непосредственного просмотра содержимого DOM.
4. Вкладка Sources отображает все ресурсы, загруженные вместе с HTML – страницей. Используется для отладки js-кода, установки breakpoints.

Вкладка Network отображает в реальном времени процесс загрузки всех ресурсов, указанных в разметке страницы.
Вкладка Console отображает ошибки на странице и вывод с помощью console.log(…)

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

Каждый DOM-узел (элемент) является объектом, соответствующим синтаксису Javascript и содержащим все свойства, определяющие его вид и поведение.
Свойства DOM-узлов:
tagName, style, innerHTML, innerText, className и пр. атрибуты, либо определенные в исходной HTML – разметке, либо установленные посредством javascript
Обработчики событий (начинаются на on..)

Для обеспечения взаимной и обратной совместимости специалисты W3C классифицировали эту модель по уровням.
Спецификации всех уровней объединены в общую группу, носящую название «W3C DOM».

на объекте, который вызывает данное событие:
Объект window группирует все свойства браузера
Объект document группирует все свойства HTML документа, обеспечивает пользовательское взаимодействие
Объект в DOM

Глобальный объект window вызывает событие 'load', когда страница закончила рендеринг, что все ресурсы были скачаны и применены
Объект document, представляющий HTML-документ, вызывает событие, 'DOMContentLoaded', когда документ закончил загрузку,
Каждый объект узла DOM, такой как div или button, вызывающий событие, называемое 'click', когда пользователь нажимает кнопку мыши, пока ее указатель находится поверх узла DOM на HTML-странице.

браузерами.

Ключевые особенности языка:
Однопоточность!
Прототипно – ориентированный язык
Слабая типизация, можно сказать, ее нет
Функции являются объектами, по сути, данными

Для работы с DOM при помощи Javascript используются глобальные объекты
document
window

Объект window представляет собой окно, содержащее DOM документ

Объект window является глобальной областью видимости (this) в каждом блоке