Css határok
CSS tulajdonságai Edge
A CSS határoló tulajdonságaiban meg lehet adni az elem szegélyének stílusát, szélességét és színét.
Ennek az elemnek határos hornya van, amely 15x széles és zöld.
Border Stílus
border-style tulajdonság határozza meg. milyen határon. megjeleníteni.
A következő értékek megengedettek:
- pontozott - Megadja a pontozott keretet,
- szaggatott - Meghatározza a szaggatott határvonalat
- szilárd - Határozott határvonalat határoz meg
- kettős - A kettős határ meghatározása
- horony - Meghatározza a hullámosított 3D szegélyt. A hatás a színkorlát méretétől függ
- gerinc - Meghatározza a 3D gerinc határát. A hatás a színkorlát méretétől függ
- beillesztés - A 3D oldalsáv határainak meghatározása. A hatás a színkorlát méretétől függ
- kezdete - A 3D elülső határ meghatározása. A hatás a színkorlát méretétől függ
- none - nem határoz meg határokat
- rejtett - egy rejtett határt határoz meg
A határoló stílusú tulajdonság egy-négy értéket tartalmazhat (a felső határ, a jobb oldali határ, az alsó határ és a bal oldali határ).
Szaggatott határ.
Szaggatott határ.
Dupla határ.
A horony határa. A hatás függ a határszín értékétől.
A gerinc határ. A hatás függ a határszín értékétől.
Beillesztett határ. A hatás függ a határszín értékétől.
Egy kezdeti határ. A hatás függ a határszín értékétől.
Rejtett határ.
Megjegyzés: Nincs a többi CSS határoló tulajdonság. az alábbiakban ismertetjük. nincs hatása. ha a határ-stílusú ingatlan nincs beállítva!
Keret szélesség
A szegély szélesség tulajdonság határozza meg a négy szegély szélességét.
A szélesség beállítható bizonyos méretűnek (px, pt, cm, em stb.). vagy három előre definiált érték közül egyet: vékony, közepes vagy vastag.
A szegély szélesség tulajdonsága 1-4 érték közül választhat (a felső határ, a jobb szél, az alsó határ és a bal oldali szegély).
p.one border-style: szilárd;
határszélesség: 5px;
>
p.two border-style: szilárd;
határszélesség: közepes;
>
p.három szegéllyel: szilárd;
szélességi szélesség: 2px 10px 4px 20px;
>
Határszín
border-color tulajdonságot használ. hogy beállítsa a négy határ színét.
A színek a következők segítségével állíthatók be:
- név - adja meg a szín nevét, a "piros"
- Hex - adja meg a hexadecimális értéket, például "# ff0000"
- RGB - adja meg az RGB értéket "rgb (255,0,0)"
- átlátszó
A határszíntulajdonságok 1-4 érték közül választhatnak (a felső határ, a jobb szél, az alsó határ és a bal oldali szegély).
Ha a határszín nincs beállítva, az elem színe örökli.
p.one border-style: szilárd;
határ-szín: piros;
>
p.two border-style: szilárd;
zöld szín: zöld;
>
p.három szegéllyel: szilárd;
határszín: piros zöld kék sárga;
>
Határ - Egyéni felek
A fenti példákból láttuk, hogy mindkét oldalon eltérő határt adhat meg.
A CSS-ben vannak olyan tulajdonságok is, amelyek meghatározzák mindegyik határt (felső, jobb, alsó és balról jobbra):
p border-top-style: pontozott;
határ-jobboldali: szilárd;
határ-alsó-stílus: pontozott;
határtalan baloldal: szilárd;
>
A fenti példa ugyanazt eredményezi, mint ez:
p border-style: szaggatott szilárd;
>
Tehát így működik:
Ha a határ-stílusú ingatlan négy jelentése:
- border-style. szaggatott szilárd kettős szaggatott;
- Felső határ szaggatott
- a jobb oldali határ szilárd
- az alsó határ fél
- a bal oldali szegély szaggatott
Ha a határoló stílusú tulajdonság három értéket tartalmaz:
- border-style. pontozott szilárd kettős;
- Felső határ szaggatott
- a jobb és bal oldali határok szilárdak
- az alsó határ fél
Ha a határstruktúra tulajdonsága két jelentéssel bír:
- border-style. pontozott szilárd anyag;
- a felső és az alsó határok pontozottak
- a jobb és bal oldali határok szilárdak
Ha a határoló stílusú tulajdonság egy értéket tartalmaz:
A fenti példában a határtípus-tulajdonságot használjuk. Azonban a szegéllyel és a határszínnel is működik.
Boundary - egy gyors tulajdon
Amint a fenti példákból látható, számos tulajdonság van, amelyeket figyelembe kell venni a határokkal való együttműködés során.
A kód lerövidítése érdekében megadhatja az összes egyéni tulajdonságot is ugyanazon tulajdonságban.
a határokon átívelő ingatlantulajdon a következő egyedi határterületekre általánosítható:
- border-width
- határvonalas (kötelező)
- border-color
p border: 5px tömör vörös;
>
További példák
Egyetlen nyilatkozatban a legjobb határ tulajdonságok
Ez a példa egy gyorsító tulajdonságot mutat be, amely egy nyilatkozatban a felső határ mindegyik tulajdonságát állítja be.
Beállítja az alsó határ stílusát
Ez a példa bemutatja az alsó szegélystílus beállítását.
Állítsa be a bal szélesség szélességét
Ez a példa azt mutatja meg, hogyan kell beállítani a bal szélesség szélességét.
Állítsa be a négy szegély színét
Ez a példa bemutatja, hogyan állíthatja be a négy szegély színét. Egy-négy színben lehet.
Állítsa be a jobb oldali színt
Ez a példa azt mutatja, hogyan állíthatja be a jobb oldali színt.