Código fuente Ya.

Puede ejecutar la o las páginas para probar el concepto inmediatamente.

 

Concepto:Tabla html con sombra

El concepto trata sobre:html,css
Autor:

Retornar

Nombre del archivo:pagina1.html

Comentarios
Primero importamos el archivo de la hoja de estilo:
<link rel="StyleSheet" href="estilos.css" type="text/css">

Disponemos un div que contiene a la tabla, este div es la sombra:
<div class="sombra">
.
.
</div>

Luego la tabla que incorporamos en este div lo desplazamos 8 píxeles hacia la
izquierda y 9 hacia arriba, relativo al contenedor (es decir el div):
  position: relative; 
  left: -8px; 
  top: -9px;
Con esto la tabla se sale del contenedor hacia la izquierda y arriba, dejando ver
parte del div en la parte derecha e inferior.

Como desventaja hay que tener cuidado que hemos invadido 8 píxeles de la 
región de la izquierda y 9 píxeles de la region superior.
Nombre del archivo:estilos.css

Retornar



Código Fuente Ya - 2015