Menu egyedi dizájnolása css felülírással gantryban hydrogén sablonnál

Több
7 éve 3 hete #11181 Írta: csicsa55
Íme az oldal, amin ráncfelvarrást végeztem:

baba-mama-bizi.hu/

A menut kicsit megdizájnoltam. Szeretném, ha a menüpontok rámutatáskor és aktív állapotban teljesen más színnel jelenjenek meg. A gantry dokumentációjában nem találtam leírást, hogy kell az adott osztályokat meghívni.

Íme az idevágó felülírás:

//Menu
.g-main-nav .g-toplevel > li > .g-menu-item-container {
font-size: 14pt;
padding-left: 15px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 5px;
margin:3px;
background: #07E3F9;
background: -webkit-linear-gradient(top, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
background: -moz-linear-gradient(top, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
background: -o-linear-gradient(top, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
background: -ms-linear-gradient(top, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
background: linear-gradient(to bottom, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
-svg-background: linear-gradient(top, #15E6F9 0, #5BEDFB 15%, #24E8F9 50%, #06E3F9 50%, #05B7C7 50%, #06E3F9 95%, #0BE5F9 100%) no-repeat;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
border-bottom: 3px solid #F804EC;
}

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
7 éve 3 hete #11182 Írta: Zotius
Az adott elemnek az "alap" állapotán felül három megkülönböztetett állapotot tudsz kezelni: hover, active, focus
A menüelem osztály neve után odaíírva (kettősponttal elválasztva) ezeket az állapotokat is tudod formázni.
Itt egy kis segítség , például:
Code:
A {color: red;} A:hover {color: cyan;} A:active {color: maroon;} A:focus {border: 1px solid red;} A:focus:hover {color: lime;}
A következő felhasználók mondtak köszönetet: csicsa55

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
7 éve 3 hete #11187 Írta: csicsa55
Köszönet. Részemről a topic zárható.

Jelentkezz be, hogy te is részt vehess beszélgetésben!