CSS Ключевые слова цвета
На этой странице будет объяснено, зачем нужны ключевые слова transparent
, currentcolor
и inherit
.
Ключевое слово transparent
Ключевое слово transparent
используется для того, чтобы сделать цвет прозрачным. Это часто используется для создания прозрачного цвета фона для элемента.
Здесь цвет фона элемента <div> будет полностью прозрачным, и фоновое изображение будет просвечивать:
body {
background-image: url("paper.gif");
}
div {
background-color: transparent;
}
Попробуйте сами »
Примечание: transparent
ключевое слово эквивалентно rgba(0,0,0,0). Цветовые значения RGBA являются расширением Значения цвета RGB с альфа-каналом - который определяет непрозрачность для цвета. Читайте больше в главах CSS RGB и Цвета CSS.
Ключевое слово currentcolor
Ключевое слово current color
похоже на переменную, которая содержит текущее значение свойства color элемента.
Это ключевое слово может быть полезно, если вы хотите, чтобы определенный цвет был согласован в элементе или на странице.
В этом примере цвет границы элемента <div> будет синим, потому что цвет текста элемента <div> синий:
div {
color: blue;
border: 10px solid currentcolor;
}
Попробуйте сами »
В этом примере цвет фона <div> установлен на текущее значение цвета элемента body:
body {
color: purple;
}
div {
background-color:
currentcolor;
}
Попробуйте сами »
В этом примере цвет границы <div> и цвет тени установлены на текущее значение цвета элемента body:
body {
color: green;
}
div {
box-shadow: 0px 0px
15px currentcolor;
border: 5px solid currentcolor;
}
Попробуйте сами »
Ключевое слово inherit
Ключевое слово inherit
указывает, что свойство должно наследовать свое значение от родительского элемента.
Ключевое слово inherit
можно использовать для любого свойства CSS и для любого HTML-элемента.
В этом примере настройки границ <span> будут унаследованы от родительского элемента:
div {
border: 2px solid red;
}
span {
border:
inherit;
}
Попробуйте сами »