Css-property border, css
A határvonal HTML-tulajdonsága lehetővé teszi az elem határának stílusát, szélességét és színét. Az elem határai mind dekoratív, mind gyakorlati feladatokat végezhetnek.
Border Stílus
A border-style tulajdonság lehetővé teszi a határ típus (stílus) meghatározását.
Ez a tulajdonság különböző értékeket vesz fel:
- pontozott - határon a pontig;
- szaggatott - a határ a stroke;
- szilárd - szilárd határ;
- kettős - dupla határ;
- horony egy háromdimenziós határ. A hatás attól függ, hogy mi a határ-szín tulajdonság értéke;
- A gerinc egy háromdimenziós határ. A hatás attól függ, hogy mi a határ-szín tulajdonság értéke;
- Az inet háromdimenziós süllyesztett határ. A hatás attól függ, hogy mi a határ-szín tulajdonság értéke;
- A kezdet háromdimenziós konvex határ. A hatás attól függ, hogy mi a határ-szín tulajdonság értéke;
- nincs - lekapcsolás;
- rejtett - rejtett határok.
A HTML határoló stílus tulajdonságának 1-4 értéke lehet (a felső, a jobb, az alsó és a bal oldalon).
Fontos! A fenti határvonalú HTML-tulajdonságok egyike sem lép érvénybe, hacsak nincs beállítva a határvonal-érték!
Határszélesség
A szegély szélesség tulajdonság határozza meg a szélesség szélességét az egyik négy oldalán az elem.
A szélesség megadható mind a mérési egységekben (px, pt, cm, em stb.), És a kulcsszavak használatával: vékony. közepes vagy vastag.
A szélesség szélessége tulajdonság értéke 1-4 lehet (a felső, a jobb, az alsó és a bal oldalon).
Border Colour
A HTML border-color tulajdonság segítségével határozhatja meg a határszínt az elem négy oldalán.
A színt többféleképpen lehet megadni:
- A név - a szín neve (pl. Piros);
- Hex - meghatározza a szín hexadecimális értékét (például # FF0000);
- RGB - megadja a szín RGB értékét (például rgb (255,0,0));
- transzparens (átlátszó).
A határszíntulajdonságok 1-4 érték közül választhatnak (a felső, a jobb, az alsó és a bal oldalon).
Ha nem állítja be a határszínt. akkor a határok el fogják örökölni az elem színét.
A határokat külön határoztuk meg
A CSS-ben határok HTML tulajdonságai vannak, amelyek meghatározzák az elem mindkét oldalának stílusát (felső, jobb, alsó és bal oldali).
Hasonló eredményt lehet elérni a következő módszerrel:
Hogy működik
Ha a HTML border style tulajdonság négy értéket tartalmaz:
- határvonal: szaggatott szilárd kettős szaggatott;
- a felső határ szögletesre van állítva;
- a jobb határ szilárd;
- az alsó kötés kettős;
- a bal oldali szegély szaggatott.
Ha a határ stílus három értéket tartalmaz:
- határtípus: szaggatott szilárd kettős;
- a felső határ szögletesre van állítva;
- a jobb és a bal határok szilárdak;
- az alsó határ kettős.
Ha a szegély-stílusnak két értéke van:
- határvonal: szaggatott szilárd;
- a felső és alsó határértékek pontozott értékkel rendelkeznek;
- a jobb és bal határok szilárdak.
Ha a HTML-szegélystílusnak egy értéke van:
- határvonal: pontozott;
- akkor mind a négy határ lesz a pontozott érték.
A fenti példákban a határ-stílusú tulajdonságot használtuk. Ne feledje azonban, hogy ugyanazok a szabályok vonatkoznak a határ szélességére. és a határszínt.
A rövidített határ tulajdon
Amint a példákból látható, az elemek határainak megtervezésénél sok különböző tulajdonságot kell alkalmazni. A kód lerövidítése érdekében használhatja a speciális tulajdonsághatárt:
Ugyanaz a tulajdonság használható az egyes elemek oldalainak határainak megmunkálására.
Bal oldali határ
Alsó kötés
Kerekített határok
A HTML határoló sugár tulajdonság lehetővé teszi, hogy egy lekerekített sarkokkal rendelkező elemet rajzoljon.
Megjegyzés: a határ-sugár tulajdonság nem támogatott az IE8 és a böngésző korábbi verzióiban.
Mint egy kifejezés, hogy azonnal stilizáljon minden felső határt
Az elemek alsó szegélyének stilizálása
Állítsa be a bal szélesség szélességét
Adja meg a négy határ színét
Adja meg az elemnek csak a megfelelő szélének színét
A "CSS Borders" cikk fordítását a Saitostroenie projekt barátságos csapata készítette el az A-tól Z-ig.