Компьютерные языки разметки Доц каф. Исит жиляк Надежда Александровна
display - определяет, как будет отображаться элемент (none, block, inline, list-item); white-space
жүктеу/скачать 1,01 Mb.
|
| display - определяет, как будет отображаться элемент (none, block, inline, list-item);
white-space - определяет, как будут отображаться пробелы между элементами (normal, pre, nowrap); list-style-type - определяет вид list-item маркера в списках (disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, none); list-style-image - задает вид list-item маркера из картинки (none, URL); list-style-position - определяет положение маркера в зависимости от list item элемента (inside, outside); list-style - обобщает вышеперечисленные свойства. Свойства элемента. position - определяет, как будет отображаться элемент по отношению к другим элементам документа (relative, absolute); top - определяет позицию элемента TOP относительно элемента родителя (значение, %); left - определяет позицию элемента LEFT относительно элемента родителя (значение,%); width - определяет ширину элемента (значение, %, auto); height - определяет высоту элемента (значение, %, auto); overflow - режим отображения содержимого элемента, при несоответствии размера элемента, размеру содержимого (non, clip, scroll); visibility - управление видимостью элемента в документе (hidden, " "). Вложенность и наследование в CSS. В хорошо структурированной каскадной таблицей стилей нет необходимости применять множество классов или id селекторов. Это возможно благодаря подробному изложению свойств селекторов внутри других селекторов. При создании веб-страницы часто приходится вкладывать одни теги внутрь других. Чтобы стили для этих тегов использовались корректно, помогут вложенные селекторы. Например, задать стиль для тега только когда он располагается внутри контейнера . Таким образом можно одновременно установить стиль для отдельного тега, а также для тега, который находится внутри другого. Вложенность. Синтаксис: Здесь E это родительский тег, а F — дочерний тег, расположенный в контейнере В этом случае стиль будет применяться к тегу Не обязательно должно быть два тега, допускается произвольный уровень вложения. При этом конструкция может записываться так: div div ul li {...}. Пример: В примере ниже, один стиль указан для всех элементов p, другой стиль указан для всех элементов с , и третий стиль указан только для элементов p с : Наследование. Наследованием называется перенос правил форматирования для элементов, находящихся внутри других. Такие элементы являются дочерними, и они наследуют некоторые стилевые свойства своих родителей, внутри которых располагаются. Например, все элементы, расположенные внутри элемента , являются его дочерними элементами и потомками. Если в стиле для задать с помощью CSS свойства color красный цвет текста, то цвет текста всех его дочерних элементов и потомков тоже станет красным: Наиболее удачным примером, на котором можно наглядно исследовать нюансы наследования CSS, является, на мой скромный взгляд, таблица html, которая создается с помощью тегов table, tr и td. Допустим, заданы свойства оформления для тега table: Теперь составим простенькую таблицу из 4 ячеек: На вебстранице она будет выглядеть следующим образом: Для данной таблицы установлен зеленый цвет текста, поэтому в ячейках слова приняли этот оттенок. Это следствие того, что дочерний элемент тег td наследует свойства своего родителя тега table. Но нужно понимать, что не все стилевые свойства подвержены наследованию. Например, border определяет рамку вокруг таблицы, но не вокруг ячеек, поэтому эти ячейки не выделены рамкой внутри таблицы. Также не наследуется свойство background. Однако, в этом случае возникает вопрос: почему же цвет фона ячеек приобрел песочный цвет, который указан в качестве значения родительского тега table, если он не наследуется? Здесь все дело в том, что у свойства background в качестве значения по умолчанию для тега td выступает transparent, то есть прозрачность. Таким образом, цвет фона родительского элемента “просматривается” сквозь фон дочернего элемента, который является прозрачным. Отмечу, что во многих случаях для большинства свойств CSS предусмотрены значения по умолчанию. Поэтому, если для какого-то свойства явно не заданы параметры, до вступает в силу предусмотренное значение по умолчанию. Наследование позволяет определять значения один раз, задавая их для родительского элемента верхнего уровня. Приоритеты стилей. Ниже приведены приоритеты браузеров, которыми они руководствуются при обработке стилевых правил. Чем выше в списке находится пункт, тем ниже его приоритет, и наоборот.
Самым низким приоритетом обладает стиль браузера — оформление, которое по умолчанию применяется к элементам веб-страницы браузером. Это оформление можно увидеть в случае «голого» HTML, когда к документу не добавляется никаких стилей. жүктеу/скачать 1,01 Mb. Достарыңызбен бөлісу:
|