Tilpasning af menu med CSS
Den øverste menu kan passes til på flere måder. Her på siden er der lavet en fast streg under det menupunkt, der er aktivt, og en glidende streg ved mouse over. Du kan se en fuld vejledning hér
Selve koden ser sådan ud, og sættes ind i “ekstra CSS” under tema-tilpasning.
/*
Denne kode styrer stregerne under menupunkterne for oven
*/#top-menu .current-menu-item a::before,
#top-menu .current_page_item a::before {
content: “”;
position: absolute;
z-index: 2;
left: 0;
right: 0;
}
#top-menu li a:before {
content: “”;
position: absolute;
z-index: -2;
left: 0;
right: 100%;
bottom: 50%;
background: #EDB059; /*** COLOR OF THE LINE ***/
height: 3px; /*** THICKNESS OF THE LINE ***/
-webkit-transition-property: right;
transition-property: right;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
#top-menu li a:hover {
opacity: 1 !important;
}
#top-menu li a:hover:before {
right: 0;
}
#top-menu li li a:before {
bottom: 10%;
}
Samme fremgangsmåde kan bruges til højre sidebar (menuen til højre)
Selve koden ser sådan ud, og sættes ind i “ekstra CSS” under tema-tilpasning.
Denne stump CSS bestemmer baggrundsfarven på menuen til højre
*/.et_pb_widget ul li {
background-color: #EDB059;
padding: 7px;
}
0 kommentarer