Este artículo tiene como objetivo agregar una o más celdas de encabezado a una celda relacionada con HTML.
Enfoque: Esto se puede hacer usando el atributo de encabezados en el documento HTML mientras se usan las etiquetas <td> y <th> . Contiene el valor, es decir, header_id, que especifica el espacio para la lista separada de ID para una o más celdas de encabezado con las que está relacionada la celda de encabezado de la tabla.
Sintaxis:
<td headers="header_id"> Content..</td>
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<!-- style to set border -->
<style>
table {
border: 3px solid black;
}
td {
border: 1px solid green;
text-align: center;
}
</style>
</head>
<body>
<center>
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>
How to set one or more header
cells a cell is related to HTML?
</h2>
<table style="width:500px">
<tr>
<th id="fruits" colspan="3">
List of fruits
</th>
</tr>
<tr>
<td Headers="fruits">banana</td>
<td Headers="fruits">grapes</td>
<td Headers="fruits">mango</td>
</tr>
<tr>
<th id="vegetables" colspan="3">
List of vegetables
</th>
</tr>
<tr>
<td Headers="vegetables">potato</td>
<td Headers="vegetables">Tomato</td>
<td Headers="vegetables">onion</td>
</table>
</center>
</body>
</html>
Producción:
Navegadores compatibles:
- Google Chrome
- explorador de Internet
- Firefox
- safari de manzana
- Ópera
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA