Foros del Web » Creando para Internet » CSS »

Tabla con CSS

Estas en el tema de Tabla con CSS en el foro de CSS en Foros del Web. En este ejemplo que realizé, es una tabla totalmente con css. Pero lo que quiero lograr es que los "ul" se pinten cuando les haces ...
  #1 (permalink)  
Antiguo 23/03/2010, 05:32
Avatar de sergio87  
Fecha de Ingreso: octubre-2007
Ubicación: Buenos Aires
Mensajes: 323
Antigüedad: 10 años, 1 mes
Puntos: 8
Tabla con CSS

En este ejemplo que realizé, es una tabla totalmente con css. Pero lo que quiero lograr es que los "ul" se pinten cuando les haces hover por encima, asi como ya está hecho con fondo blanco pero que ocupe todo el "ul" no cada li por separado.

Cuando hago el hover de UL como que no queda bien! :O

http://www.sergioiglesias.com.ar/tabla.html

necesito vuestra ayuda. Gracias.

Sergio
  #2 (permalink)  
Antiguo 23/03/2010, 09:03
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 8 años, 8 meses
Puntos: 1
Respuesta: Tabla con CSS

Vos sabe que no esto no estas de acordo con la Web Semantica.
uno leitor de tela no vas pasar la informacion de la manera correcta

mas haga lo seguinte

Código CSS:
Ver original
  1. ul:hover{
  2. background-color:#066;
  3. }
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #3 (permalink)  
Antiguo 23/03/2010, 09:06
Avatar de kalvinman  
Fecha de Ingreso: octubre-2006
Ubicación: Bogota Colombia
Mensajes: 849
Antigüedad: 11 años, 2 meses
Puntos: 22
Respuesta: Tabla con CSS

o se eniende muy bien lo que escirbes pero en fin creo que el codigo va sin los dos puntos entre el ul y el hover. xD
  #4 (permalink)  
Antiguo 23/03/2010, 09:16
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 8 años, 8 meses
Puntos: 1
Respuesta: Tabla con CSS

yo estoy indicando algo com selectores CSS. Caso encontres outra solucion esta libre para hacer comentarios.
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.

Última edición por flpms; 23/03/2010 a las 09:19 Razón: No va servir com lo seletor para ul
  #5 (permalink)  
Antiguo 23/03/2010, 09:31
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 8 años, 8 meses
Puntos: 1
Respuesta: Tabla con CSS

intentas utilizar las tablas mismos com las classes donde quiere que tenga efecto hover

Código HTML:
Ver original
  1.     <tr>
  2.          <th>Diseño</th>
  3.          <th>Programacíon</th>
  4.          <th>Otros</th>
  5.     </tr>
  6.     <tr>
  7.          <td>Adobe Photoshop</td>
  8.          <td>Adobe Flex</td>
  9.          <td>Manejo de PC</td>
  10.     </tr>
  11.     <tr>
  12.          <td>Adobe Ilustrator</td>
  13.          <td>Action Script</td>
  14.          <td>Suite Office</td>
  15.     </tr>

Código CSS:
Ver original
  1. Ahora CSS:
  2.  
  3. table{
  4.  background-color:#FFFCE4;
  5. }
  6.  
  7. table tr th:hover, table tr td:hover{
  8.       background-color:#FFFFFF;
  9. }
  10.  
  11. table tr:hover{
  12.      background-color:#CCCCCC;
  13. }

Este codigo és semanticamiente correcto. Solo tiene que hacer los cambios para tuya necesiudad
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #6 (permalink)  
Antiguo 25/03/2010, 14:25
Avatar de sergio87  
Fecha de Ingreso: octubre-2007
Ubicación: Buenos Aires
Mensajes: 323
Antigüedad: 10 años, 1 mes
Puntos: 8
Respuesta: Tabla con CSS

Cita:
Iniciado por flpms Ver Mensaje
Vos sabe que no esto no estas de acordo con la Web Semantica.
uno leitor de tela no vas pasar la informacion de la manera correcta

mas haga lo seguinte

Código CSS:
Ver original
  1. ul:hover{
  2. background-color:#066;
  3. }
No entendi que escribiste, pero el codigo que me pasaste no funciona. Aunque esta bien hecho, en este caso no funciona. Gracias.

Cita:
Iniciado por kalvinman Ver Mensaje
o se eniende muy bien lo que escirbes pero en fin creo que el codigo va sin los dos puntos entre el ul y el hover. xD
Kalvinman, va con los dos puntos si queres hacer un hover. Saludos.

Cita:
Iniciado por flpms Ver Mensaje
intentas utilizar las tablas mismos com las classes donde quiere que tenga efecto hover

Código HTML:
Ver original
  1.     <tr>
  2.          <th>Diseño</th>
  3.          <th>Programacíon</th>
  4.          <th>Otros</th>
  5.     </tr>
  6.     <tr>
  7.          <td>Adobe Photoshop</td>
  8.          <td>Adobe Flex</td>
  9.          <td>Manejo de PC</td>
  10.     </tr>
  11.     <tr>
  12.          <td>Adobe Ilustrator</td>
  13.          <td>Action Script</td>
  14.          <td>Suite Office</td>
  15.     </tr>

Código CSS:
Ver original
  1. Ahora CSS:
  2.  
  3. table{
  4.  background-color:#FFFCE4;
  5. }
  6.  
  7. table tr th:hover, table tr td:hover{
  8.       background-color:#FFFFFF;
  9. }
  10.  
  11. table tr:hover{
  12.      background-color:#CCCCCC;
  13. }

Este codigo és semanticamiente correcto. Solo tiene que hacer los cambios para tuya necesiudad

Ya en mi web la tengo hecha en tablas esa parte, por eso ahora quiero realizarlo con UL y con LI. Como te daras cuenta nada esta hecho en tablas.

Saludos.

Etiquetas: tablas
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 17:32.