Cómo crear el efecto de focus en CSS para elementos de una tabla

  • Autor Autor eljulio
  • Fecha de inicio Fecha de inicio
E

eljulio

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
saludos,

estoy trabajando en un sitio que quiero hacerle un efecto como :


Lo que quiero hacer y no he podido lograr es el efecto que tienen los servicios de la pagina (arriba de esta linea) cuando paso el Mouse por arriba, me parece que es un Focus y habia pensado hacer algo como esto:

#miestilo td:focus{
background-color:#elcolor;
}

Se supone que en mi Tabla tengo esto:
<table id="miestilo"><tr>
<td >el nombre de mi servicio</td>
</tr></table>

Pero por alguna razon no me funciona, ¿porqué será?

¿en que estoy fallando?
 
Si te refieres al menu, yo creo que es el efecto hover en enlaces, que cambian la imagen de fondo.
 
prueba poniendo #miestilo td:hover{

a ver si te sale 😉
 
Si te refieres al menu, yo creo que es el efecto hover en enlaces, que cambian la imagen de fondo.

No es el Menu, en el contenido hay una imagen grande de Servicios de unas personas que están com oen un despacho, debajo de esa foto hay una lista de servicios que tienen una imagen en miniatura a la izquierda. Cuando pasas el Mouse encima de ellos a toda la fila le cambia el color de fondo a un tono un poco mas claro.

prueba poniendo #miestilo td:hover{

a ver si te sale 😉

Asi lo hice y nada

este es el codigo de mi css:
Insertar CODE, HTML o PHP:
#serind td{
	height:25pt;
	color:#FFF;
	font-family:Georgia, "Times New Roman", Times, serif;
}
#serind td.loservicios:hover{
	height:25pt;
	color:#000;
	font-family:Georgia, "Times New Roman", Times, serif;
}

Como los datos son dinamicos este es el codigo que utilizo en mi php:
Insertar CODE, HTML o PHP:
<H1>Servicios que ofrece nuestra Firma:</H1>
   <p><a href="registrar_marca.php"><img src="images/registrarMarca.gif" alt="Registrar Marca" width="139" height="36" border="0"/></a></p>
 <?php
$mysqldb->query("SELECT * FROM servicios  WHERE idioma=$idioma");
  
 if ($mysqldb->numRows()>0)
  { echo "<table  border='0' align='left' cellpadding='2' cellspacing='5' id='serind'>";
   $cont=0;
   while ($datos=$mysqldb->fetchObject())
       {  $img="";	    
		  if (file_exists("img_opciones/servicio_".$datos->id_servicio.".jpg")) $img="<img src='img_opciones/servicio_".$datos->id_servicio.".jpg' width='25' height='25'>";	
		  
		  		  	 
		 echo "<tr>
				 <td>$img</td><td class='loservicios'><a href='detalle_servicios.php?codigo=".$datos->id_servicio."&idioma_sel=".$idioma."'>".$datos->nombre."</a>
			  </td></tr>";
			 		
		$cont++;
		
	   }
	  echo "</table>"; 
	   
	}

esto ya me tiene sofocado.
 
Cuando pasas el Mouse encima de ellos
:hover en el selector (class o id)
toda la fila le cambia el color de fondo
:hover en el selector (class o id) + background
a un tono un poco mas claro.
#serind td{ height:25pt; color:#FFF; font-family:Georgia, "Times New Roman", Times, serif; } #serind td.loservicios:hover{ height:25pt; color:#000; font-family:Georgia, "Times New Roman", Times, serif; }
:hover en el selector (class o id) + background con color diferente (color son para las letras, no para el fondo)

=

.loservicios:hover {
background: #ddd;
}

Previo ...
2023-05-22_234056.jpg
 
Cuando el HTML y CSS eran algo diferentes en esos años que ahora.
 
Atrás
Arriba