column-rule-style
- Data publikacji
- Ostatnio edytowano
Przeznaczenie właściwości column-rule-style
Za pomocą właściwości column-rule-style możemy określić styl linii oddzielającej kolejne kolumny, na które została podzielona treść interesującego nas elementu HTML.
- Informacje dodatkowe
-
brak
Informacje techniczne o właściwości column-rule-style
- przeznaczenie
-
element HTML, którego treść może oraz została podzielona na kolumny
- pozycja
-
dowolna
- dziedziczenie
-
nie
- wartość initial
- wyjątki initial
-
brak
- animowanie
-
tak (animacja schodkowa)
Interpretacja właściwości column-rule-style
-
tak
-
tak
-
tak
-
tak
-
tak, lecz od wersji 10
-
tak
Zobacz więcej informacji o interpretacji właściwości column-rule-style.
Opis wartości właściwości column-rule-style
styl linii
Wyjaśnienie
Za pomocą właściwości column-rule-style oraz dowolnej dostępnej wartości stylu linii możemy określić styl linii oddzielającej kolejne kolumny, na które została podzielona treść interesującego nas elementu HTML.
Przykład
column-rule-style:dashed;
Stylem linii oddzielającej kolejne kolumny, na które została podzielona treść przykładowego elementu "div" jest styl "dashed" (pojedyncza przerywana linia), ponieważ do wspomnianego elementu "div" została dodana właściwość "column-rule-style" wraz z wartością "dashed".
Kod źródłowy przykładu
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
column-width:200px;
column-rule-width:5px;
column-rule-style:dashed;
column-rule-color:black;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
ten tekst wyświetlony w oknie przeglądarki internetowej został umieszczony w zawartości tego przykładowego elementu "div" wyłącznie w celach prezentacyjnych, ten tekst wyświetlony w oknie przeglądarki internetowej został umieszczony w zawartości tego przykładowego elementu "div" wyłącznie w celach prezentacyjnych, ten tekst wyświetlony w oknie przeglądarki internetowej został umieszczony w zawartości tego przykładowego elementu "div" wyłącznie w celach prezentacyjnych
</div>
</body>
</html>