Foros del Web » Creando para Internet » CSS »

Cambiar el backgronud de un li

Estas en el tema de Cambiar el backgronud de un li en el foro de CSS en Foros del Web. Hola! quiero cambiar por CSS el fondo de un <li> que no contenga <a> @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código CSS: Ver original .ec_cestanav {     float ...
  #1 (permalink)  
Antiguo 25/10/2013, 07:53
 
Fecha de Ingreso: diciembre-2010
Mensajes: 236
Antigüedad: 13 años, 4 meses
Puntos: 6
Cambiar el backgronud de un li

Hola! quiero cambiar por CSS el fondo de un <li> que no contenga <a>

Código CSS:
Ver original
  1. .ec_cestanav{
  2.     float:left;
  3.     width:100%;
  4.     list-style:none;
  5. }
  6. .ec_cestanav li{
  7.     float: left;
  8.     width: 20%;
  9.     background-image: url('Images_sys/ico32_ball_gris.png');
  10.     background-repeat: no-repeat;
  11.     background-position: center;
  12.     vertical-align:bottom;
  13.     text-align:center;
  14.     height:64px;
  15. }
  16. .ec_cestanav li[title]{
  17.     background-image: url('Images_sys/ico32_ball_verde.png');
  18.  
  19. }

Código HTML:
Ver original
  1. <ul class="ec_cestanav">
  2.                 <li>Cesta</li>
  3.                 <li title="1234"><a href="?????.asp ">Login</a></li>
  4.                 <li>Envío</li>
  5.                 <li>Pago</li>
  6.                 <li>Confirmación</li>

Lo he conseguido hacer pero añadiendo un title a la <li> en cuestión, pero veo que hay otra manera más limpia sin necesidad de hacer tal chapuza.

He probado con:

.ec_cestanav li~a{
background-image: url('Images_sys/ico32_ball_verde.png');
}

.ec_cestanav a:before{
background-image: url('Images_sys/ico32_ball_verde.png');

}
y nada, no me cambia el fondo.

El contenido de las eti
  #2 (permalink)  
Antiguo 25/10/2013, 08:49
 
Fecha de Ingreso: diciembre-2010
Mensajes: 236
Antigüedad: 13 años, 4 meses
Puntos: 6
Respuesta: Cambiar el backgronud de un li

Código completo agregando el atributo title:

Código HTML:
Ver original
  1. <ul class="ec_cestanav">
  2.     <li title="">
  3.         Cesta
  4.     </li>
  5.            
  6.     <li>
  7.         <a href="ec_cesta.asp?cestanav=2">Login</a>
  8.     </li>
  9.                    
  10.     <li>
  11.         <a href="ec_cesta.asp?cestanav=3">Envío</a>
  12.     </li>
  13.                    
  14.     <li>
  15.         <a href="ec_cesta.asp?cestanav=4">Pago</a>
  16.     </li>
  17.                    
  18.     <li>
  19.         <a href="ec_cesta.asp?cestanav=5">Confirmación</a>
  20.     </li>
  21.                    
  22. </ul>

Código CSS:
Ver original
  1. .ec_cestanav{
  2.     float:left;
  3.     width:100%;
  4.     list-style:none;
  5. }
  6. .ec_cestanav li{
  7.     float: left;
  8.     width: 20%;
  9.     background-image: url('Images_sys/ico32_ball_gris.png');
  10.     background-repeat: no-repeat;
  11.     background-position: center;
  12.     vertical-align:bottom;
  13.     text-align:center;
  14.     height:64px;
  15.     text-shadow: #D1D1D1 0 2px 2px;
  16.     font-size: 1.3em;  
  17. }
  18. .ec_cestanav li[title]{
  19.     background-image: url('Images_sys/ico32_ball_verde.png');
  20.  
  21. }


Y aquí el código Asp:

Código ASP:
Ver original
  1. <%
  2. 'Nos posicionamos en la barra de navegación. La posición actual
  3. 'no tendrá enlace y el fondo será verde
  4. CestaNav=Request.QueryString("cestanav")
  5. If CestaNav = "" Then CestaNav = 1
  6. %>
  7.            
  8. <ul class="ec_cestanav">
  9.     <%
  10.     Dim Opc_CestaNav(5)
  11.     Opc_CestaNav(1) = "Cesta"
  12.     Opc_CestaNav(2) = "Login"
  13.     Opc_CestaNav(3) = "Envío"
  14.     Opc_CestaNav(4) = "Pago"
  15.     Opc_CestaNav(5) = "Confirmación"
  16.     For I=1 To 5
  17.         %>
  18.         <li <%If Cint(CestaNav) = I Then Response.Write "title=''"%> >
  19.             <%
  20.             If Cint(CestaNav) <> I Then
  21.             %>
  22.             <a href="<%=Nombre_Pagina%>?cestanav=<%=I%>"><%=Opc_CestaNav(I)%></a>
  23.         <%
  24.         Else
  25.             Response.Write Opc_CestaNav(I)
  26.         End If
  27.         %>
  28.     </li>
  29.    
  30. <%
  31. Next
  32. %>
  33. </ul>

Etiquetas: background-image
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:57.