Hogyan készítsünk blokkot lekerekített sarkokkal csak css-en
És még egyszer, Hello kedves olvasó a blog. Ma CSS-sel próbálunk gyönyörű és egyszerű blokkokat lekerekített sarkokkal csinálni. Azt mondom egyszerre, nincs semmi bonyolult, csak minimális ismereteket igényel a CSS-től, és természetesen tudja, hol és hol ragadja meg :-)
Ezeknek a blokkoknak nagyon nagy pluszuk az, hogy csak CSS formátumban készültek, anélkül, hogy bármilyen képet használnának, ami azt jelenti, hogy semmiféle terhelést nem hordanak a szerveren.
Hát most nézzük meg, hogyan készülnek.
Blokk létrehozása
Először létre kell hoznunk a leggyakoribb blokkot, amelyhez olyan változót adunk meg, mint Box. Ezt később használjuk a címkén
Ez minden, az első lépés, amit láttunk, amint látom, hogy a blokk hozzávetőleges magasságát és szélességét állítom be, természetesen ezeket az értékeket a kívánt paraméterekre módosíthatja.
Blokk kialakítása
Most gyönyörű kilátás nyíljon a blokkra, nevezetesen árnyékot és a sarkokat:
Amint látja, itt is megváltoztathatja az összes paramétert tetszés szerint, megváltoztathatja a háttérszínt, a határok sugarát, az árnyékot és a színét. A fő kísérlet.
Nos, most alkalmazzuk mindezt a gyakorlatban. Például:
Most győződjön meg róla, hogy mi van a példában.
Sajnos, vagy talán szerencsére módszer CSS3 és specifikáció a szabványok még nem fogadták el, amíg az összes böngésző, beleértve az összes IE „kedvenc” nem támogatott vagy részlegesen támogatott útján „mankók”. Reméljük, hogy a közeljövőben képesek leszünk, hogy teljes mértékben kihasználja az összes funkcióját CSS3.
Opera 11 19,45%
Chrome 16 19,15%
Microsoft Internet Explorer 8 12,8%
Firefox 9 9.52%
Firefox 8 4.84%
Microsoft Internet Explorer 9 4.72%
Firefox 3 4,49%
Microsoft Internet Explorer 7 4.37%
Chrome 12 2,1%
Köszönöm, sok információ hasznos volt)))