Hogyan készítsünk egy szép css gombok
Szia kedves látogató! A mai cikkben fogunk beszélni a CSS gombok. Megtanulják, hogyan kell létrehozni gyönyörű tengeri fajok CSS gombokkal a blogok és weboldalak.
Hogyan készítsünk CSS gombot? Hála CSS stílusokat, akkor lehet, hogy a különböző gombokat, amellyel szeretné hatásokat, és nem is kell, hogy egy kis kép vagy JavaSkripti.
Az a képesség, hogy hozzon létre a CSS gombok nem kell csak a kezdők, a közelmúltban létrehozott egy blog vagy website, ez a tudás hasznos lesz azoknak, akik szeretnének javítani terveiket.
- elegáns gomb
- Recept fájlt értéke
- Készítsen gyönyörű CSS gomb
- Az eredmény az arcon
SIMA BUTTON böngésző alapú HTML, hozzáadása nélkül CSS stílus külleme
Megjegyezzük, hogy a gomb kinézete függ nemcsak a böngészőt használ, hanem asztali témák. Példával elöl járni: a legnépszerűbb böngésző (Mozila Firefox, IE és az Opera) Itt van a kulcs a szokásos stílusában Windows XP:
Tezhe gombot, de a transzformált OC klasszikus stílust, akkor így néz ki:
Természetesen a gomb lehet változtatni, ha más stílust, itt egy példa a gombok:
Nyissa meg a mappát a témát style.css fájlt, és felírni a következő
Hozzon létre egy gomb így néz ki
Options gomb kódját, akkor cserélje, és azt, mivel ez lesz jó látni, hogy az Ön számára! Például Adjunk CSS gomb hangerő, vagyis megváltoztatni a paraméter a lehetőségeket:
Változás, hogy a következő paramétereket:
A gomb most így néz ki:
Most Adjunk CSS gomb dekoráció CSS 3, ez úgy értendő, amelyet minden modern böngésző.
Ha a felhasználó a régi böngésző, csak nem fogja látni néhány hatását a mi gombok, csak azt, hogy figyelmeztesse, hogy van mitől félni, és nem is ez nem befolyásolja a működését egy gombot, mert a CSS stílusok használata csak dekoráció.
Hozzunk létre, ami nem az, hogy osztály, hogy az univerzális kód, például, hogy egy osztály .blue pápista és ugyanabba az osztályba
CSS kód így fog kinézni
Miért van szükség az osztályok? Ha minden utánam, ez azt jelenti, hogy a blog most kétféle gombok, amit meg is tettünk, címkékkel és tag
Válaszul arra a kérdésre: miért kell az osztályok - a megfelelő helyen teszed az osztály, majd a gomb fog kinézni, és a színe, ahogy tetszik.
Most pedig, hogy két gomb, az egyik nem adja egy osztály, és a többi fog mutatni.
/ * Gomb Az osztály jelzése * /
Do lekerekített sarkú gombok, a következőket írta:
Most, a kód a következőképpen néz ki:
Most, így a hangerő gombot, hozzátéve, fehér csík a tetején, és a belső árnyék:
Mint látható, lehet kísérletezni a végtelenségig lehetőségek tengeren. Még mindig lehet egy áttetsző árnyék körül a gombot. Cserélje ki a kód:
Az utolsó példa
Készíts egy hűvös hatást, ha lebeg az egérmutatót a gomb meg fog változni, és ha rákattint, hogy az, hogy a CSS gombok megnyomásával. Tesszük ezt a segítségével az osztály: hover és osztály: aktív. Fogjunk pseudo-osztály: lebeg a tag
Mivel a pszeudo-osztály: aktív, hogy egy kattintás hatása, adjuk hozzá a kódot, amit használhat egeret, helyezze egy árnyékot a balra a belső részén a gombot, és a tetején, jól mozog a szöveg egy kicsit, hogy az alsó és a jobb:
Az utolsó lehetőség a gombok kinézni (mutatja a legfrissebb változat) a CSS stílus:
Tekintse meg a művelet akkor jobb saytbare blog „pálya menü”.
Különösen akkor
Share hasznos információ