Lebegő gombot az oldalán az oldalon, mnogoblog
Szia, ma beszéljünk arról, hogyan lehet létrehozni egy lebegő gombra a honlapon, hogy megadja az eredeti webhelyen.
Töltse le a forráskódot a cikket alatt lehet
Vegyük például a standard wordpress téma - Húsz Tizenegy.
Így alkotunk fog kinézni, mint egy gomb:
Demo például itt található:
Miután alján style.css fájlt illessze be az alábbi kódot:
ahol:
szélesség: 30px; - a szélessége a gombot.
magasság: 150px; - magassága a gombot.
bal: 0; - bal margó, ha ezt a vonalat jobbra: 0; - a gomb kerül a jobb, akkor is meg a behúzás, képpontban, például: bal: 20px;
top: 200px; - a felső margó.
z-index: 99999; - meghatározza a helyét az elem tetején a többiek, például a kép fejléc a húsz Tizenegy téma ez a paraméter 9999 és ha a gomb lenne alacsonyabb értékű ezt a beállítást, akkor alul helyezkedik el.
Azt is hozzá egy sort:
háttér: # 2B96C6; - ez határozza meg a háttérben a gombot, akkor meg mind a szín és a kép.
Ez után azonnal a body tag helyezünk a termelés a gomb:
Mint látható, a kód normális kapcsolat, csak akkor kap egy különleges besorolású -
class = »add_comment», stílus amit bekezdésben előírt 1 ebben a cikkben.
3. Ahhoz, hogy a design a gombot, akkor létre kell hozni neki képet.
Kaptam az alábbi képet:
Akkor töltse le és próbálja illessze be a honlapon, vagy a vizsgálati helyszínen minden szabad tárhely (használom hostinger.ru).
Most köti ezt a képet, hogy egy gomb, ez a gomb megváltoztatja a kimeneti kódot, amelyet én javasoltam 2. bekezdésben ezt a cikket, a következő:
Itt és kész a gomb, már csak azt kell hozzáadni egy linket a kívánt oldalra minket, mint ez: