Button Gmail és a Google Reader, HTML és CSS
Gombok, mint a Gmail és a Google Reader
Üdvözlet! Ma azt látjuk, hogy hogyan készül ilyen aranyos gombok közül néhány a Google internetes termékeket.
Mire jók? Ezek megkövetelik kis kódot, megjelenik mindenütt ugyanaz, könnyen változtatni a design a gombok és tudod, hogy azok kép nélkül, ha szükséges.
A nagyon megvalósítása ilyen gomb tartozik Douglas Bowman. Abban az időben az írás, Douglas volt már 3 változatai gombok, melyek közül az egyik használata nélkül is a képek, csak a HTML és CSS.
Ma nézzük csak az elmúlt 2 végrehajtását, és indítsa el a „kartinochnoy” változat.
Verzió képekkel
Nos, a kép, az az igazság, csak az egyik - a gradiens a gombra. Ha a gradiens nem kritikus, és tehetünk képek nélkül. Szeretne gradiens és kép nélkül - scroll alábbi ;-)
Általánosságban elmondható, hogy lesz 4 típusú gombok - balra, jobbra, középre és egyetlen.
Mi lesz 2 változat a gombok - az egyik
Mindkét esetben az általunk használt beágyazott :
Verzió kép nélkül
Megmondom csak azt az elvet, végrehajtása, és akkor képes lesz arra, hogy a forráskód példák.
Az ötlet az, hogy amellett, hogy a két hozzátesszük belül is és . Velük mi emulálni a lejtőt. De ez a felismerés még csak jól működik a Firefox és a Safari, de nem működik az IE. Most megy nézni egy példát.
Társalapító Vremenno.net. Érdekli az online üzlet, design, a használhatóság és a kliens program. Részt vesz a fejlesztése több internetes projekteket.
Néha azt írta a Twitteren. hanem sokkal inkább a Vremenno.net.