Cursos para compartir lo que sabes8.790.114 alumnos
Manual HTML
Capýtulo 28:
Combinación de celdas
La combinación de celdas permite obtener diseños de tablas más sofisticados que pueden utilizarse para titulares, marcos de imagen, etc.
Para combinar celdas se usa la instrucción Colspan o Rowspan, ya sea que se deseen combinar columnas o filas.
Por ejemplo, la siguiente instrucción combina las tres columnas de la primera fila de una tabla.
<td width="100%" colspan="3" height="34">Fila combinada</td>
Para ilustrar mejor el uso de combinación de celdas, a continuación se muestra la siguiente tabla.
El código para obtener una tabla con este aspecto se muestra a continuación.
<html>
<head><title>Mi tabla combinada</title></head>
<body>
<table Border=1 width=100%>
<tr>
<td width="100%" colspan="4">Primera fila combinada</td>
</tr>
<tr>
<td width="25%">Columna 1</td>
<td width="25%">Columna 2</td>
<td width="25%">Columna 3</td>
<td width="25%">Columna 4</td>
</tr>
</table>
</body>
</html>
La expresión ColSpan indica cuántas columnas se van a combinar, en este indican cuatro columnas. Si se desean combinar filas se debe utilizar la expresión RowSpan. Por ejemplo RowSpan="4" indica que se van a combinar 4 filas.
La siguiente tabla muestra un ejemplo de combinación de columnas y filas.
El código para esta tabla es el siguiente:
<html>
<head>
<title>Pagina nueva 1</title>
</head>
<body>
<table border="1" width="100%">
<tr>
<td width="100%" colspan="4">Fila combinada</td>
</tr>
<tr>
<td width="25%" rowspan="4">Área RowSpan</td>
<td width="25%">Celda 1</td>
<td width="25%">Celda 2</td>
<td width="25%">Celda 3</td>
</tr>
<tr>
<td width="25%">Celda 4</td>
<td width="25%">Celda 5</td>
<td width="25%">Celda 6</td>
</tr>
<tr>
<td width="25%">Celda 7</td>
<td width="25%">Celda 8</td>
<td width="25%">Celda 9</td>
</tr>
<tr>
<td width="25%">Celda 10</td>
<td width="25%">Celda 11</td>
<td width="25%">Celda 12</td>
</tr>
</table>
</body>
</html>
EjercicioCon los conocimientos adquiridos acerca del uso de tablas, combinación de celdas y temas anteriores como viñetas, inserción de imágenes y películas, diseña la página que se muestra a continuación.
Sobre el curso
Nuestras novedades en tu e-mail
Cursos similares a Manual HTML
- Výdeo
- Alumnos
- Valoraciýn
- Cursos
|
1. Manual de GMail Google, la mayoría de las personas conocen a esta empresa, pero no todas saben que,... [27/11/06] |
21.606 | ||||
|
2. HTML. Introducción práctica HTML, este lenguaje para la creación de páginas Web o sitios de Internet, es la... [23/07/09] |
4.600 | ||||
|
3. Cómo exportar una animación de Flash a HTML En este curso de vídeo se enseña la manera de transportar o exportar animaciones... [29/06/12] |
20 |
|
|||
-
0. Presentaciýn
-
1. Introducción
-
2. Estructura de una página Web
-
3. Guardado del archivo como página Web
-
4. Modificación de una página Web
-
5. Estilos de título
-
6. Comandos básicos de formateo de texto
-
7. Marcador de párrafo
-
8. Color e imagen de fondo de la página
-
9. Color de texto e hipervínculos
-
10. Manejo de párrafos
-
11. Interlineados
-
12. Hipervínculos
-
13. Hipervínculos externos
-
14. A una URL
-
15. A un correo electrónico
-
16. Inserción de imágenes
-
17. Tamaño y alineación de una imagen insertada
-
18. Aplicación de bordes a imágenes
-
19. Imágenes como hipervínculos
-
20. Películas
-
21. Numeración y viñetas
-
22. Numeración
-
23. Términos y definiciones
-
24. Tablas
-
25. Definición de filas
-
26. Control del ancho de la tabla
-
27. Control de celdas
-
28. Combinación de celdas
-
29. Marcos
-
30. Marcos II
-
31. Marcos III
-
32. Formularios
-
33. Elementos para introducir los datos
-
34. Áreas de texto
-
35. Ejemplo de formulario
-
36. Opciones de menús
-
37. Botones de radio
-
38. Casillas de verificación