Índice

Posición de la leyenda de las tablas

El atributo align de la etiqueta <caption> en HTML 4.0 ha desaparecido; por ello es preciso invocar esta propiedad de estilo si queremos posicionar la leyenda en la tabla.

caption-side:

top;: leyenda situada por encima de la tabla (valor por defecto).

bottom;: leyenda situada por debajo de la tabla.

Ejemplo

<!DOCTYPE html> 
<html lang="es"> 
<head> 
<title>Html5</title> 
<meta charset="UTF-8">  
<style type="text/css"> 
table { width: 200px; 
        text-align: center; 
        border : 1px solid gray; 
        border-collapse: collapse;} 
td { border : 1px solid gray;} 
caption { caption-side: bottom;} 
</style> 
</head> 
<body> 
<p></p> 
<table> 
<caption>Leyenda de la tabla</caption> 
<tr> 
<td>1</td><td>2</td><td>3</td> 
</tr> 
<tr> 
<td>4</td><td>5</td><td>6</td> 
</tr> 
<tr> 
<td>7</td><td>8</td><td>9</td> 
</tr> 
</table> 
</body> 
</html>
images/CAP15IMG07.png