Tema: subrayar menu
Ver Mensaje Individual
  #6 (permalink)  
Antiguo 16/03/2011, 13:40
raherlo
 
Fecha de Ingreso: marzo-2010
Ubicación: España
Mensajes: 25
Antigüedad: 14 años, 8 meses
Puntos: 0
Respuesta: subrayar menu
este es el css

Código CSS: 
Ver original
  1. /* CSS Document */
  2. body, html{
  3. padding:0px;
  4. margin:0px;
  5. }
  6. #contenedor {
  7.     background: #a5bc61;
  8.     width: 925px;
  9.     margin-left: auto;
  10.     margin-right:auto;
  11.     padding-left:35px;  
  12.     margin-top:0px;
  13. } 
  14.  
  15. #menu{
  16.     float:left;
  17.     width: 175px;
  18.     margin-top: 0px;
  19.     
  20. }
  21. #menu li, #menu ul{
  22.     display:block;
  23.     margin:0px;
  24.     padding:0px;
  25. }
  26. #menu li a {
  27.     margin-left: 18px !important;
  28.     color: #FFF;
  29.     text-decoration:none;
  30. }
  31. #principal{
  32.     margin-left: 238px;
  33. }
  34. #menu li.principal{
  35.     width:172px;
  36.     line-height: 37px;
  37.     background-image:url(/imagenes/fondo_boton1.jpg);
  38.     background-repeat:no-repeat;
  39.     padding: 2px;
  40.     
  41.     
  42. }
  43. #menu ul{
  44.     background: #cbe798;
  45.     margin-top:  5px !important;
  46.     margin-bottom: 5px  !important;
  47.     padding-top:15px !important;
  48.     padding-bottom: 15px !important;
  49.     line-height:20px !important;
  50. }
  51. #menu ul li{
  52.     margin-left: 20px;
  53. }
  54.  
  55. #menu li.principal li {
  56.     background-image:none;
  57. }
  58. #menu li ul a{
  59.     color: #2d498a;
  60. }
  61. #pie {
  62.     clear:both;
  63.     bottom:0px;
  64.     
  65. }
  66. #contenido {
  67.     margin-top: -23px;
  68.     
  69. }
  70. #menu {
  71.     margin-top: 2px;
  72.     
  73. }
  74. #contenido{
  75.     width: 925px;
  76.     margin-left: auto;
  77.     margin-right:auto;
  78.     padding-left:35px;  
  79. }
  80. #principal{
  81.     background: #ecf0d3;
  82.     width: 600px;
  83.     height: 480px;
  84. }
  85. #principal h1 {
  86.     margin-left:18px;
  87.     padding-top: 33px;
  88.     color:#d80a31;
  89.     font-size: 24px;
  90.     font-weight: normal;
  91.     font-family: Arial, Helvetica, sans-serif;
  92. }
  93. #principal .foto {
  94.     margin-left:40px;
  95.     background:#FFFFFF;
  96.     padding:5px;
  97.     display:inline-block;
  98.     
  99. }
  100. #principal .duende {
  101.     width:117px;
  102.     height:214px;
  103.     margin-left:575px;
  104.     background-image:url(/imagenes/duende.gif);
  105.     position:absolute;
  106. }
  107. #principal .cuerpo {
  108.     color:#172444;
  109.     font-size: 13px;
  110.     font-family: Arial, Helvetica, sans-serif;  
  111.     padding: 25px;
  112.     text-align: justify;
  113. }


y este es el menu

Código PHP: 
Ver original
  1. <ul id="menu">
  2.     <li class="principal"><a href="index.php">Empresa</a>
  3.         <ul>
  4.             <li><a href="nosotros.php">Sobre nosotros</a></li>
  5.             <li><a href="instalaciones.php">Instalaciones</a></li>
  6.             <li><a href="localizar.php">Localización</a></li>
  7.             <li><a href="contacto.php">Contacto</a></li>
  8.         </ul>
  9.     </li>
  10.     <li class="principal"><a href="servicios.php">Servicios</a></li>
  11.     <li class="principal"><a href="#">Novedades</a></li>    
  12.     <li class="principal"><a href="galeria.php">Galería Fotos</a></li>
  13.  
  14.  </ul>

muchas gracias...
Última edición por raherlo; 17/03/2011 a las 16:42