Słowa kluczowe w kolorze CSS
Na tej stronie wyjaśniono słowa kluczowe transparent, currentcolori
inherit.
Przejrzyste słowo kluczowe
Słowo transparentkluczowe służy do uczynienia koloru przezroczystym. Jest to często używane do tworzenia przezroczystego koloru tła dla elementu.
Przykład
Tutaj kolor tła elementu <div> będzie w pełni przezroczysty, a obraz tła będzie widoczny przez:
body {
background-image: url("paper.gif");
}
div {
background-color: transparent;
}
Uwaga: słowo transparent
kluczowe jest równoważne rgba(0,0,0,0). Wartości kolorów RGBA są rozszerzeniem wartości kolorów RGB o kanał alfa, który określa krycie koloru. Przeczytaj więcej w naszym rozdziale CSS RGB oraz w naszym rozdziale CSS Colors .
Słowo kluczowe currentcolor
Słowo currentcolorkluczowe jest jak zmienna, która przechowuje bieżącą wartość właściwości koloru elementu.
To słowo kluczowe może być przydatne, jeśli chcesz, aby określony kolor był spójny w elemencie lub na stronie.
Przykład
W tym przykładzie kolor obramowania elementu <div> będzie niebieski, ponieważ kolor tekstu elementu <div> jest niebieski:
div {
color: blue;
border: 10px solid currentcolor;
}
Przykład
W tym przykładzie kolor tła <div> jest ustawiony na bieżącą wartość koloru elementu body:
body {
color: purple;
}
div {
background-color:
currentcolor;
}
Przykład
W tym przykładzie kolor obramowania i kolor cienia <div> jest ustawiony na bieżącą wartość koloru elementu body:
body {
color: green;
}
div {
box-shadow: 0px 0px
15px currentcolor;
border: 5px solid currentcolor;
}
Dziedziczenie słowo kluczowe
Słowo inheritkluczowe określa, że właściwość powinna dziedziczyć swoją wartość z elementu nadrzędnego.
Słowo inheritkluczowe może być używane w dowolnej właściwości CSS i w dowolnym elemencie HTML.
Przykład
W tym przykładzie ustawienia obramowania <span> zostaną odziedziczone z elementu nadrzędnego:
div {
border: 2px solid red;
}
span {
border:
inherit;
}