Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Cornelius

sobre menus

Por , em Desenvolvimento frontend

Recommended Posts

Cornelius    0

Cornelius
Postado

Opa, beleza gente! Sou novo no css e estou aprendendo a fazer menus. Só que não consigo mudar a cor do <li> completamente (só fica colorido atrás do nome). Ficaria muito grato se uma boa alma me auxiliasse.

 

HTML

 

<html>

<head>

 

<link rel="stylesheet" type="text/css" href="menu.css">

 

<title></title></head>

 

<body>

 

<div id="menu">

<ul>

<li><a href="oi.html">Linha 1</a></li>

<li><a href="oi.html">Linha 2</a></li>

<li><a href="oi.html">Linha 3</a></li>

<li><a href="oi.html">Linha 4</a></li>

<li><a href="oi.html">Linha 5</a></li>

<li><a href="oi.html">Linha 6</a></li>

<li><a href="oi.html">Linha 7</a></li>

</ul>

</div>

 

</body>

</html>

 

 

CSS:

 

#menu div {

width:120px;

background: red;

border: 2px red solid;

padding: 5px;

}

 

#menu ul {

width:110px;

background: #3D3DB8;

padding: 2px;

border: 1px solid orange;

margin: 0px;

}

 

#menu li {

background: #3D3DB8;

list-style: none;

paddin: 3px 5px;

border-top: 1px solid #00B8F5;

font: 12px verdana, tahoma, arial;

text-decoration: none;

margin: 0.3em 0 0.3em 0.3em;

}

 

#menu li a:link {

display: block;

color: #FFFFFF;

text-decoration: none;

}

 

#menu li a:visited {

color: #FFFFFF;

text-decoration: none;

}

 

#menu li a:hover {

color: black;

background-color: orange;

text-decoration: none;

}

 

 

Vlws!!! http://forum.imasters.com.br/public/style_emoticons/default/devil.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

Truca tudo isso:

#menu li a:link {display: block;color: #FFFFFF;text-decoration: none;}#menu li a:visited {color: #FFFFFF;text-decoration: none;}#menu li a:hover {color: black;background-color: orange;text-decoration: none;}
Por isso:

#menu li a:link, #menu li a:visited, #menu li a:hover {display: block;color: #FFFFFF;text-decoration: none;}#menu li a:hover {color: black;background-color: orange;}

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito