Стиль – набор параметров, задающий внешнее представление объекта.Таблица стилей – это инструмент языка html, предоставляющий возможности по улучшению внешнего отображения страницы средствами структурного программирования.Таблица стилей содержит набор правил (стилей), описывающих оформление
Слайд 2Стиль – набор параметров, задающий внешнее представление объекта. Таблица стилей –
это инструмент языка html, предоставляющий возможности по улучшению внешнего отображения
страницы средствами структурного программирования. Таблица стилей содержит набор правил (стилей), описывающих оформление самой Web-страницы и отдельных ее фрагментов. Каждый элемент на странице может иметь свой стиль (параграфы, заголовки, линии, текст...). Набор стилей всех элементов называют таблицей стилей.
Уровень 1 (CSS1) – принята 17.12.96, Уровень 2 (CSS2) –
принята 12.05.98 Уровень 2 (CSS2.1) – принята 07.06.11 Уровень 3 (CSS3) –
разрабатывается
Слайд 5Правило таблиц CSS состоит из двух частей: селектор {свойство1: значение;
свойство2: значение}
1. Селектор – любой тэг html, для которого определение задает
каким образом необходимо его форматировать. 2. Определение – состоит из двух частей: свойства значения
Слайд 6Пример P { color: #0000FF } P - это селектор. Он представляет
собой имя тега . color - это свойство (атрибут) стиля. Он
задает цвет текста. #0000FF - это значение атрибута стиля color. Оно представляет код синего цвета, записанный в формате RGB
Слайд 7Правила CSS 1. Несколько параметров можно перечислять через двоеточие, либо задавать отдельно
каждый параметр. 2. Если для одного селектора определяются одинаковые атрибуты, но
с разными значениями, то использоваться будет тот, что указан в коде последним. P { color: green } P { color: red } 3. Свойства и их значения в CSS не чувствительны к регистру, поэтому их можно набирать как заглавными, так и строчными символами.
Слайд 8Способы связывания документа и таблиц стилей: 1. Связывание – позволяет
использовать одну таблицу стилей для форматирования многих страниц html. Для
этого таблица стилей хранится в отдельном файле с расширением CSS. Присоединяется к документам с помощью тэга , задаваемого в разделе . Пример:
В связываемом файле содержатся наборы правил CSS, определяющих форматирование документа.
Слайд 123. Импортирование - позволяет встраивать в документ таблицу стилей, расположенную
на сервере. Выполняется это с помощью свойства @import:url("mystyles.css").
Слайд 134. Встраивание в тэги документа – позволяет изменить форматирование конкретных
элементов страницы. Пример: Заголовок 1. Отображается красным цветом
Слайд 14Приоритеты CSS (от низшего к высшему), используемые при форматировании: 1. Связанная
таблица стилей (по LINK) 2. Импортируемая таблица стилей (@import) 3. Правила с
элементом html в качестве селектора 4. Правило с параметром CLASS в качестве селектора 5. Правило с параметром ID в качестве селектора 6. Встроенное в тэг html правило
Слайд 15Связанные, внедренные и импортированные таблицы стилей влияют на форматирование всех
элементов документа. Встраивание таблицы стилей в конкретный тэг влияет только
на отображение его элементов. Все способы встраивания таблиц стилей свободно могут сочетаться в одном документе. Вложенный элемент наследует правила форматирования элемента-родителя
можно свободно комбинировать все три правила группирования для уменьшения её
размеров.
Слайд 18Наследование Наследованием называется перенос правил форматирования для элементов, находящихся внутри других.
Такие элементы являются дочерними, и они наследуют некоторые стилевые свойства
своих родителей, внутри которых располагаются.
Слайд 19Идентификаторы Идентификатор элемента задается при помощи параметра id, в качестве
значения которого указывается уникальное имя. На странице можно использовать только один
идентификатор с определенным именем, но несколько идентификаторов с разными именами. Т.е. идентификатору соответствует только один элемент на странице. Параметр ID можно применять к любому элементу документа. #Имя идентификатора { свойство1: значение; свойство2: значение; ... }
Слайд 20Идентификаторы можно применять к конкретному тегу. Тег#Имя идентификатора { свойство1:
Слайд 22Классы Класс позволяет задать разные правила форматирования для одного элемента определённого
типа или всех элементов документа. Имя класса указывается в селекторе
правила после имени тега и отделяется от него точкой. Можно определить несколько правил форматирования для одного элемента и с помощью параметра class соответствующего тега применять разные правила форматирования. Тег.Имя_класса { свойство1: значение; свойство2: значение; ... }
Если неприятность может случиться, то она обязательно случится, можем ввести свое наблюдение: После того, как веб-страница будет корректно отображаться в одном браузере, выяснится, что она неправильно показывается в другом.
Если не удалось найти и скачать доклад-презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:
![Пример Q {font-style: italic} Q[title] {color: maroon} Продолжая известный закон Мерфи, который гласит:](/img/tmb/7/627818/c192c4edd1bfc6f449243c7c5f81b7ce-800x.jpg "Каскадные таблицы стилей CSS Пример Q {font-style: italic} Q[title] {color: maroon} Продолжая известный")
