Barva obrysu CSS
Barva obrysu CSS
Vlastnost outline-color
se používá k nastavení barvy obrysu.
Barvu lze nastavit:
- jméno - zadejte název barvy, například "červená"
- HEX – zadejte hexadecimální hodnotu, například „#ff0000“
- RGB – zadejte hodnotu RGB, například „rgb(255,0,0)“
- HSL – zadejte hodnotu HSL, například "hsl(0, 100%, 50%)"
- invertovat - provede inverzi barev (která zajistí, že obrys bude viditelný bez ohledu na barvu pozadí)
Následující příklad ukazuje některé různé obrysy s různými barvami. Všimněte si také, že tyto prvky mají uvnitř obrysu také tenký černý okraj:
Pevný červený obrys.
Tečkovaný modrý obrys.
Počáteční šedý obrys.
Příklad
p.ex1
{
border: 2px solid black;
outline-style: solid;
outline-color: red;
}
p.ex2
{
border: 2px solid black;
outline-style: dotted;
outline-color: blue;
}
p.ex3
{
border: 2px solid black;
outline-style: outset;
outline-color: grey;
}
HEX hodnoty
Barvu obrysu lze také určit pomocí hexadecimální hodnoty (HEX):
Příklad
p.ex1 {
outline-style: solid;
outline-color: #ff0000;
/* red */
}
Hodnoty RGB
Nebo pomocí hodnot RGB:
Příklad
p.ex1 {
outline-style: solid;
outline-color: rgb(255, 0, 0); /*
red */
}
Hodnoty HSL
Můžete také použít hodnoty HSL:
Příklad
p.ex1 {
outline-style: solid;
outline-color: hsl(0, 100%, 50%);
/* red */
}
Více o hodnotách HEX, RGB a HSL se můžete dozvědět v našich kapitolách Barvy CSS .