Własność CSS border-right to własność zbiorcza CSS służąca do ustawiania szerokości, stylu i koloru prawej krawędzi obramowania elementu. Jest to własność niedziedziczona, która obejmuje następujące własności obramowania:
Własności obejmowane przez własność border-right też są własnościami zbiorczymi, odnoszącymi się do wszystkich czterech krawędzi obramowania na raz.
Przykład
W tym przykładzie element footer
będzie miał zielone przerywane obramowanie prawe o szerokości 5 pikseli:
footer {
border-right: 5px dashed green;
width: 200px;
}
...
<footer>Lorem ipsum dolor sit amet.</footer>
Efekt:

Wartości i składnia
Własność zbiorcza border-right
przyjmuje jedną, dwie lub trzy wartości odnoszące się do obejmowanych przez nią własności. Ich kolejność jest bez znaczenia. Jeśli brakuje jednej lub dwóch wartości, to automatycznie stosowane są wartości domyślne dla danych ustawień.
border-width
: liczba z jednostką długości lub słowo kluczowethin
,medium
albothick
. Szczegółowy opis tych słów kluczowych znajduje się w opisie własnościborder-width
. Wartość domyślna:medium
.border-style
: słowa kluczowenone
,hidden
,dotted
,dashed
,solid
,double
,groove
,ridge
,inset
,outset
. Szczegółowy opis tych słów kluczowych znajduje się w opisie własnościborder-style
. Wartość domyślna:none
.border-color
: dowolny typ wartości koloru CSS. Wartość domyślna:currentcolor
.
Ponieważ kolejność wartości we własności border-right
nie ma znaczenia, wszystkie poniższe deklaracje są prawidłowe i znaczą to samo.
border-right: 5px solid red;
border-right: red solid 5px;
border-right: solid 5px red;
Jeśli któraś wartość zostanie pominięta, to nadawana jest jej wartość początkowa. W praktyce oznacza to, że można pominąć tylko ustawienie szerokości i koloru, ponieważ pominięta własność stylu zostanie domyślnie ustawiona na none
, co będzie oznaczało brak obramowania, np.:
border-right: 1px red;
Ta deklaracja jest równoznaczna z tą:
border-right: 1px red none;
Zastosowanie
Własność border-right
ma zastosowanie do wszystkich elementów HTML, a także do pseudoelementu ::first-letter
.
Podsumowanie
Zastosowanie | Wszystkie elementy i pseudoelement ::first-letter |
Własności składowe | |
Obsługiwane wartości |
|
Wartość początkowa | Wartości początkowe odpowiadają wartościom początkowym własności składowych, czyli:
|
Dziedziczenie | Nie |
Specyfikacja | CSS Backgrounds and Borders Module Level 3 – border-right |