td/th colSpanPropiedades
Objeto td/th
Definición y uso
La propiedad colSpan establece o devuelve el número de columnas que abarca una celda.
Sintaxis
Establecer la propiedad colSpan:
tdObject.colSpan="number"
o
thObject.colSpan="number"
o
thObject.colSpan="number"
Devolver la propiedad colSpan:
tdObject.colSpan
o
thObject.colSpan
o
thObject.colSpan
Tip: There is no default value for the colSpan property.
| Valor | Descripción |
|---|---|
| number | Define el número de columnas que abarca. |
Compatibilidad del navegador
![]()
![]()
![]()
![]()
![]()
Todos los navegadores principales admiten la propiedad colSpan.
Ejemplo
Ejemplo
El siguiente ejemplo cambia el número de columnas que abarca una celda:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ejemplo (example.com)</title>
<script>
function displayResult(){
document.getElementById("myHeader1").colSpan="2";
}
</script>
</head>
<body>
<table border="1">
<tr>
<th id="myHeader1">Mes</th>
<th id="myHeader2">Depósito</th>
</tr>
<tr>
<td>January</td>
<td>$100.00</td>
</tr>
<tr>
<td>February</td>
<td>$10.00</td>
</tr>
<tr>
<td>March</td>
<td>$80.00</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">Cambiar el número de columnas que abarca la primera celda</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Ejemplo (example.com)</title>
<script>
function displayResult(){
document.getElementById("myHeader1").colSpan="2";
}
</script>
</head>
<body>
<table border="1">
<tr>
<th id="myHeader1">Mes</th>
<th id="myHeader2">Depósito</th>
</tr>
<tr>
<td>January</td>
<td>$100.00</td>
</tr>
<tr>
<td>February</td>
<td>$10.00</td>
</tr>
<tr>
<td>March</td>
<td>$80.00</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">Cambiar el número de columnas que abarca la primera celda</button>
</body>
</html>
Pruébalo »
Objeto td/th Otras extensiones