Ciao ho installato il tema Zen ma vorrei modificare alcuni parametri per una regione che conterrà i links primari.
#page_top li
{
display:inline;
float:left;
top: 0px;
font-size:14px;
font-weight:bold;
font-family: Verdana;
overflow:hidden;
}
#page_top li a
{
display: block;
overflow: hidden;
color:white;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top li a:visited
{
display: block;
overflow: hidden;
background: url(images/MenuItem.png);
background-color: transparent;
}
#page_top li a:hover
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top li a:focus
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -50px;
}
#page_top li a:active
{
color: black;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -50px;
}prima di utilizzare zen avevo utilizzato artisteer e sembrava tutto bellissimo poi però se uno deve fare delle modifiche va al manicomio...
l'immagine è composta da tre stadi:
nero
grigio scuro
grigio chiaro
il primo è di base quando non ci passo sopra, grigio scuro quando sono sopra con il mouse e vorrei attivare il grigio chiaro quando è attivo il link ma non ne vengo fuori, qualcuno può darmi una mano?
Grazie
Tz
#page_top li
{
display:inline;
float:left;
top: 0px;
font-size:14px;
font-weight:bold;
font-family: Verdana;
overflow:hidden;
}
#page_top li a
{
margin-right: 1px;
margin-left: 1px;
display: block;
overflow: hidden;
color:white;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top li a:visited
{
display: block;
overflow: hidden;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top li a:hover
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top li a:focus
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top li a.active <------------------------ ho modificato in questo punto.
{
color: black;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 25px;
}
Hmm. So che l'hai risolto, ma io non trovo un id 'page_top' in Zen. Nè nel page.tpl.php, nè in zen.css.
Comunque, credo che puoi ristringere il campo se usi
#primary a, ecc, ecc. Così modifichi solo gli anchor di primary links, non di tutti gli anchor in quella zona...John
Più imparo, più dubito.
ciao scusa mi sono dimenticato di avvisare chiunque avesse deciso di rispondere che avevo creato una nuova regione chiamata #page_top.
Tz
questo è il codice presente nel mio .css
#page_top li{
display:inline;
float:left;
top: 0px;
font-size:14px;
font-weight:bold;
font-family: Verdana;
overflow:hidden;
margin: 0 -5px 0 -5px;
}
#page_top li a
{
height: 24px;
display: block;
overflow: hidden;
color:white;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top li a:visited
{
display: block;
overflow: hidden;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top li a:hover
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top li a:focus
{
color:#fff;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top li a.active
{
color: black;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 25px;
}
#page_top ul a:visited
{
padding: 0 10px 0 10px;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 0px;
}
#page_top ul a:hover
{
padding: 0 10px 0 10px;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top ul a:focus
{
padding: 0 10px 0 10px;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px -25px;
}
#page_top ul a.active
{
padding: 0 10px 0 10px;
background: url(images/MenuItem.png);
background-color: transparent;
background-position: 0px 25px;
}
e questo è il codice presente nel layout-fixed.css
#page_top{
margin:0;
background-color:black;
width:1000px;
height: 25px;
text-align: left;
padding-bottom: 5px;
}
Sembra funzionare tutto a dovere...