-
Cómo Obtener imágenes para solapar una tabla en HTML
-
Traducción de sus ideas de diseño en una página real, trabajando web a veces puede ser difícil. Puede que tenga que poner en peligro debido a las limitaciones de lenguaje de marcado de hipertexto (HTML) y hojas de estilo en cascada (CSS). Por ejemplo, puede utilizar CSS para forzar una imagen para superponer una tabla HTML, pero la imagen no puede ser parte de la mesa. Usted puede colocar su tabla dentro de una "<div>", que es más ancho y más alto que la mesa y usar la imagen como el "<div>" como imagen de fondo. Si el atributo de color fondo de la tabla se ajusta a "transparente", la imagen se mostrará a través y la superposición de la tabla.Instrucciones
1 Haga clic en el botón "Inicio", "Todos los programas" y "Accesorios". Haga clic en "Bloc de notas" o el nombre de otro editor de texto.
2 Escriba el siguiente código en el editor de texto, reemplazando "yourimage.jpg" con la ubicación y el nombre de la imagen que desea mostrar a través y alrededor de la mesa.
<Html>
<Body><Div style = "width: 450px; altura: 350px; Imagen de fondo: url (yourimage.jpg);">
<Table width = 350 border = 1 style = "background-color: transparente">
<Tr>
<Td width = "50%"> Primera Fila Columna 1 </ td>
<Td width = "50%"> Primera Fila Columna 2 </ td>
</ Tr>
<Tr>
<Td> Segunda Fila Columna 1 </ td>
<Td> Segunda Fila Columna 2 </ td>
</ Tr>
</ Table>
</ Div></ Body>
</ Html>3 Haga clic en "Archivo" y "Guardar". Guardar con el nombre de archivo "test.html".
4 Haga clic en el botón "Inicio", "Todos los programas" y "Internet Explorer" o el nombre de otro navegador web. Haga clic en "Archivo" y "Abrir archivo".
5 Busque el archivo "test.html" que ha creado, seleccionarlo y hacer clic en "Abrir".
Consejos y advertencias
- Usar CSS posicionamiento absoluto para colocar una imagen debajo de una mesa. La posición de su imagen y la tabla de modo que uno se superpone a la otra. Dar a la imagen un índice z de -99 y la mesa un índice z de 1. Esto asegura que la mesa siempre mostrará en la parte superior de la imagen.
- Aunque los navegadores web modernos se adhieren a los estándares más estrechamente que nunca antes, su diseño web todavía puede mostrar de forma diferente dependiendo de la marca del navegador utiliza su visitante. Si el diseño depende de la colocación exacta de elementos de la página web, usted debe probar su diseño en tantos navegadores diferentes y versiones de navegadores como sea posible.
