Ejercicio 212
Crea una página web que tenga el mismo aspecto que la siguiente imagen:
El documento HTML base es el siguiente:
<!DOCTYPE html>
<html>
<head>
<title>Tabla compleja</title>
<style>
table, tr, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
Categoría Etiquetas
Formulario
form
button
input
select
textarea
Tabla
table
tr
th
td
caption
Texto
b
em
i
strong
sub
sup
</body>
</html>
Solución
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Elementos HTML</title>
<style>
table,
tr,
th,
td {
border: 1px solid black;
}
</style>
</head>
<body>
<table>
<tr>
<th>Categoría</th>
<th>Etiquetas</th>
</tr>
<tr>
<th rowspan="5">Formulario</th>
<td>form</td>
</tr>
<tr>
<td>button</td>
</tr>
<tr>
<td>input</td>
</tr>
<tr>
<td>select</td>
</tr>
<tr>
<td>textarea</td>
</tr>
<tr>
<th rowspan="5">Tabla</th>
<td>table</td>
</tr>
<tr>
<td>tr</td>
</tr>
<tr>
<td>th</td>
</tr>
<tr>
<td>td</td>
</tr>
<tr>
<td>caption</td>
</tr>
<tr>
<th rowspan="6">Texto</th>
<td>b</td>
</tr>
<tr>
<td>em</td>
</tr>
<tr>
<td>i</td>
</tr>
<tr>
<td>strong</td>
</tr>
<tr>
<td>sub</td>
</tr>
<tr>
<td>sup</td>
</tr>
</table>
</body>
</html>
Probar en el navegador