| Tulajdonság |
Leírás |
Lehetséges értékek |
border-style
border-top-style
border-right-style
border-bottom-style
border-left-style |
Keret stílusának megadása. Ha nem állítjuk be, nem fog látszani a keret! |
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset |
border-width
border-top-width
border-right-width
border-bottom-width
border-left-width |
Keret vastagságának megadása. |
thin
medium
thick
length |
|
Az összes lehetséges keretstílus.
Először mindig a keret stílusát kell megadni, csak így fog látszani a keret! Ha megadunk egy keretstílust, akkor már látszani fog a keret, és mind a négy oldalon ugyanaz lesz a stílus. A border-width tulajdonsággal megvastagítottam a kereteket, hogy jobban látszódjanak.
Különböző keretstílusok a négy oldalon.
Lehetőségünk van akár mind a négy oldalra (border-top-style, border-right-style, border-bottom-style, border-left-style) különböző kereteket megadni. A négy oldal értékét külön-külön is beállíthatjuk a felsorolt tulajdonságokkal, de egyszerre is a border-style tulajdonsággal. Ha a border-style tulajdonságnak csak egy értéket adunk meg, akkor az összes oldalra érvényes lesz; ha kettőt, akkor a felső és az alsó keret kapja az első stílust, míg a jobb és a bal oldal a második stílust; ha hármat, akkor a felső keret kapja az első stílust, a jobb és bal oldal a második stílust, míg az alsó keret a harmadikat; ha mind a négy stílust megadjuk, akkor a felső kerettől indulva az óramutató járásával megegyezően (top, right, bottom, left) kapják a keretek a stílusokat. Ugyanez vonatkozik a border-width (keretvastagság) és a border-color (keretszín) tulajdonságokra is.
|
border-color
border-top-color
border-right-color
border-bottom-color
border-left-color |
Keret színének megadása. |
color-rgb
color-hex
color-name |
| Különböző oldalon lévő keretek színének megadása. |
border
border-top
border-right
border-bottom
border-left |
Rövidebben lehet megadni a keret tulajdonságait, ebben a sorrendben: vastagság, stílus, szín. |
border-width
border-style
border-color |
|
Kerettulajdonságok rövidített megadása.
Ha a border tulajdonságot használjuk, akkor mind a négy oldali keret ugyanolyan lesz, és az értékeket ebben a sorrendben kell megadni: border-width, border-style, border-color, egymással szóközzel elválasztva.
Ha a border-top tulajdonságot használjuk, akkor a megadott három jellemző csak a felső keretre lesz érvényes, ha a border-right tulajdonságot, akkor a jobboldalira és így tovább. A border-hez kellő három jellemző közül vagy az első (border-width), vagy az utolsó (border-color) elhagyható, de a középső (border-style) nem! (Hiszen ez kell ahhoz, hogy megjelenjen a keret.)
Lekerekített keret megvalósításának egy lehetséges módja.
A CSS 2.1 egyik hiányossága, hogy nem tudunk vele lekerekített kereteket létrehozni. A CSS 3-ba már bekerült ez a lehetőség, de amíg nem támogatják a böngészők, addig képeket kell használnunk erre a célra. Ez a példa a még nem tárgyalt float tulajdonságot használja, ami egyszerűen balra, vagy jobbra úsztatja ki a sarokképeket. Ennek a lekerekített sarkú doboznak a szélessége százalékban is megadható.
|
|
AJÁNLOM AZ OLDALT
Friss bejegyzések
Friss hozzászólások
Archívum
