Kluczowe kolory CSS
- Poprzednia strona Kolory CSS
- Następna strona Przejście CSS
Rozdział będzie wyjaśniał transparent,currentcolor i dziedziczenie Kluczowa nazwa.
Kluczowa nazwa transparent
transparent Nazwa kluczowa jest używana do uczynienia koloru przezroczystym. Zwykle jest używana do ustawienia przezroczystego koloru tła elementu.
Przykład
W tym przykładzie, kolor tła elementu <div> będzie całkowicie przezroczysty, a obraz tła będzie wyświetlany:
body {
background-image: url("paper.gif");
}
div {
background-color: transparent;
}
Uwaga:transparent Nazwa kluczowa jest równoważna rgba(0,0,0,0)Wartości kolorów RGBA są rozszerzeniem wartości kolorów RGB, mających kanał alpha – określają oni przezroczystość koloru. Więcej informacji znajdziesz w naszej CSS RGB Rozdział i Kolory CSS Rozdział.
Kluczowa nazwa currentcolor
currentcolor Nazwa kluczowa jest podobna do zmiennej, która przechowuje aktualną wartość atrybutu color elementu.
Jeśli chcesz, aby określony kolor był spójny w elemencie lub stronie, ta nazwa kluczowa będzie bardzo użyteczna.
Przykład
W tym przykładzie, kolor ramki 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 elementu <div> ustawiony jest na aktualną wartość koloru elementu body:
body {
color: purple;
}
div {
background-color: currentcolor;
}
Przykład
W tym przykładzie, kolor krawędzi i kolor cienia <div> są ustawione na wartość koloru bieżącego elementu body:
body {
color: zielony;
}
div {
box-shadow: 0px 0px 15px currentcolor;
border: 5px solid currentcolor;
}
Słowo kluczowe dziedziczenie
dziedziczenie Słowo kluczowe określa, że atrybut powinien dziedziczyć wartość od elementu nadrzędnego.
dziedziczenie Słowa kluczowe mogą być używane dla każdego atrybutu CSS i mogą być używane z każdym elementem HTML.
Przykład
W tym przykładzie, ustawienie krawędzi <span> będzie dziedziczone od elementu nadrzędnego:
div {
border: 2px solid czerwony;
}
span {
border: dziedziczenie;
}
- Poprzednia strona Kolory CSS
- Następna strona Przejście CSS
