Ver Mensaje Individual
  #5 (permalink)  
Antiguo 28/12/2006, 11:14
Avatar de iconogt
iconogt
 
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 576
Antigüedad: 19 años, 7 meses
Puntos: 4
Re: Consulta sobre <li> y <a>

Hola a todos [as],

Zubzero, checate la forma en que yo lo hago y me cuentas si te sirve.

XHML
Código:
<div id="bloque">
<div id="menu">

     <h1>Men&uacute;</h1>

<ul>
<li><a href="#html">Inicio</a></li>
<li><a href="#html">Blog Personal</a></li>
<li><a href="#html">Noticias Recientes</a></li>
<li><a href="#html">Quienes somos?</a></li>
<li><a href="#html">Proyectos</a></li>
<li><a href="#html">Multimedia</a></li>
<li><a href="#html">Galer&iacute;a</a></li>
<li><a href="#html">Art&iacute;culos</a></li>
<li><a href="#html">Zona de descargas</a></li>
<li><a href="#html">Contactanos</a></li>
</ul>

</div>
</div>
CSS
Código:
/*esto es opcional, lo utilice para dar formato al modulo */
div#bloque {
position : relative;
width : 320px;
height : auto;
margin : 10% auto;
padding : 5px;
border : 1px outset #eee;
}

	/**********************************
	*******************************
	el div[menu], encierra el listado desordenado
	*********************************	
	*************************************/

div#menu {
position : relative;
width : 300px;
height : auto;
margin : 0 auto;
padding : 3px;
text-align : left;
border : 1px outset #eee;
background : transparent url(css.png) no-repeat right bottom;
}

#menu ul {
list-style-type : none;
margin : 0 auto;
padding : 2px;
}

#menu >ul li {
margin : 0;
padding : 2px;
font : normal 8pt Tahoma, Arial, Verdana, Serif, Symbol;
}

#menu >ul li a {
display : block;
text-decoration : none;
width : auto;
height : 17px;
margin : 0;
padding : 2px 0 0 20px;
background-color : inherit;
color : #828598;
}

#menu >ul li a:hover {
display : block;
width : auto;
height : 17px;
background-color : inherit;
color : #000;
background-color : #ddf;
}


#bloque #menu h1 {
font : normal 100 28pt Georgia, Serif, Sans-Serif, Symbol;
margin : 0;
padding : 0;
background-color : inherit;
color : #AACC66;
letter-spacing : -6px;
word-spacing : 4px;
}
Así de fácil!... si te das cuenta es cuestion de jugar con los selectores y el resultado es, [pienso yo] muy bueno Si tienes dudas o quisieras hacer alguna otra pregunta que te haya surgido a ultimo momento puedes postearla y con gusto te hechamos la mano
__________________
_______
Jorge Rojas.

Última edición por iconogt; 28/12/2006 a las 11:19 Razón: había un error en el código :D