Введение в CSS

Базовый синтаксис CSS селектор { свойство1: значение; свойство2: значение; } селектор некоторое имя стиля, для которого добавляются параметры форматирования

Пример использования стилей Заголовки h1 { color: #a6780a; font-weight: normal; } h2 { color: olive; border-bottom: 2px solid black; } Заголовок 1 Заголовок 2

Способы добавления стилей на страницу 1.Внутристрочная стилевая информация. 2.Использование элемента STYLE в разделе HEAD HTML–документа. 3.Определение внешних стилевых таблиц.

Внутристрочная стилевая информация. Атрибут style Этот текст имеет зеленый цвет и выводится жирным. Шрифт Arial. ________________________________ Этот текст имеет зеленый цвет и выводится жирным. Шрифт Arial.

Использование тэга style в разделе HEAD HTML–документа. … p {color: green; font-weight: bold; font-family: Arial;} Этот текст имеет зеленый цвет и выводится жирным. Шрифт Arial. _____________________________________________ Этот текст имеет зеленый цвет и выводится жирным. Шрифт Arial.

Определение внешних стилевых таблиц. Тэг link … Заголовок Текст документа…

Определение внешних стилевых таблиц. Стилевой файл H1 { color: #000080; font-size: 200%; font-family: Arial, Verdana, sans-serif; text-align: center; } P { padding-left: 20px; }

Преимущества стилей Разграничение кода и оформления Разное оформление для разных устройств Расширенные по сравнению с HTML способы оформления элементов Ускорение загрузки сайта Единое стилевое оформление множества документов Централизованное хранение