Sarkok lekerekítése CSS-el - border-radius
Először a lekerekítést mutatom be, amely a border-radius tulajdonság.
A border-radius CSS kódja
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border: 3px solid #000000;
background-color: #940000;
Ennél a kódnál a terület mind a négy sarkának az értékét külön-külön meg tudjuk adni. Így akár eltérő vagy ellentétes formákat (ovális, ellipszis) is létre lehet hozni.
Ha mind a négy sarkot egyforma méretűre szeretnénk beállítani, akkor egyszerűbb, ha egy értékkel adjuk meg a lekerekítés értékét.
A rövidebb kód
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
Vagy akár kört is tudunk rajzolni az alábbi módon
border-radius: 225px 225px 225px 225px;
-moz-border-radius: 225px 225px 225px 225px;
-webkit-border-radius: 225px 225px 225px 225px;
5 hozzászólás
Ezt a megjegyzést eltávolította a szerző.
VálaszTörlésNincs válasz lehetőség
VálaszTörlésÉs ezt hova kell beilleszteni pontosan??:)
VálaszTörlésKöszönöm előre a választ!:)
És ezt hova kell beilleszteni pontosan??:)
VálaszTörlésKöszönöm előre a választ!:)
A weblap css kódjába a megfelelő elemhez.
VálaszTörlésPl:
div {
border: 2px solid;
border-radius: 25px;
}