A képek vagy szöveg köré helyezett keretek díszítik az oldalt, és változatosabbá teszik annak kialakítását. Ha táblákat használ szegélyek létrehozásához, akkor az egyes szegélyek kódjai túl sok helyet foglalnak el. Ezenkívül újra kell írnia az egyes keretek HTML kódját. A CSS segítségével könnyedén létrehozhat bármilyen vastagságú és színű szegélyt, ha egyszer egyszerû kódot ír be az összes elemhez, amelyet ez a szegély vesz körül. Ez a technológia lehetővé teszi, ha szükséges, néhány perc alatt megváltoztathatja a webhely kereteinek típusát.
Szükséges
- - legyen saját weboldala;
- - tudja, mi a CSS, és hol vannak ezek a stílusok az oldalon írva.
Utasítás
1. lépés
Szegély létrehozásához először írja be a következő kódot a CSS-be:
ramka {}
2. lépés
A szegély méretének megfelelővé tételéhez használja a border-width paramétert, amely a vonal szélességét pixelben állítja be. Például, ha a keret vonalának 3 pixel szélesnek kell lennie, akkor a bejegyzés a következőképpen fog kinézni:
ramka {border-width: 3px;}
3. lépés
Most határozza meg a szegély stílusát a szegély stílusának paraméterével. Ha olyan szegélyt szeretne létrehozni, amelynek oldalai szabályos folytonos vonalak, akkor tegye a következő bejegyzést a kódba a göndör zárójelek közé - border-style: solid.
4. lépés
Pontozott szegélyt az alábbiak szerint lehet megszerezni: határstílus: pontozott. A határ stílusának ellenőrzése: szaggatott, szaggatott szegélyt kap.
5. lépés
A szegélyt kettős folytonos vonallá teheti, így: border-style: double. Használjon szegélystílust: barázda vagy szegélystílus: gerinc a szöveg vagy képek keretezéséhez 3D-s mellékhatásokkal. A különbség e két lehetőség között az, hogy az első esetben a keret behúzott vonalakból áll, a másodikban domborúakból.
6. lépés
Használja ezt a kódot: border-style: inset a beillesztés hatásának létrehozásához a site elem határával. Ahhoz, hogy a határ tartalma, a szegéllyel együtt, éppen ellenkezőleg, domború legyen, írja a border-style: outset szöveget.
7. lépés
Hozzáadhatja a kívánt színt a kerethez a border-color paraméter segítségével, amelyet szintén a göndör zárójelek közé helyeznek. Ha a szegélyt pirosra akarja tenni, akkor írja be a határ színét: piros, kék - szegély színe: kék, narancs - szegély színe: narancs.
8. lépés
A CSS határkód az összes opcióval együtt így néz ki:
ramka {határszélesség: 3px; határ-stílus: szilárd; szegélyszíne: kék;}
9. lépés
Most, HTML-ben írja ezt:
Keret tartalma A "Keret tartalma" kifejezés helyett írja be a kívánt kép szövegét vagy kódját.
10. lépés
Így korlátlan számú elemet tervezhet a webhelyen. A keret megjelenésének megváltoztatásához csak a CSS-kódot kell megváltoztatnia.
