Código html e css dunha táboa

Lenda da táboa
ano webs páxinas Liñas
1 2 3 4 5
6 7 8 9

Aínda que moita xente emprega as táboas para maquetar (construir a plantilla ou layout), as táboas só se deben de empregar para gardar datos numéricos. Presento un pequeno exemplo sen funcionalidade ningunha, pero nel compártense filas e columnas e dáselle estilos con código css.

 

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Táboa</title>
    <style>
    table{
        width:70%;
        margin:0 auto;
    }    
    table, tr, th, td{
        border:1px solid grey;
        border-collapse: collapse;
    }
    table th[scope="col"]{
        background-color:rgba(25,25,25,0.2);        
    }
    table th[scope="row"]{
        background-color:rgba(125,205,75,0.2);
        
    }
    td{
        text-align: center;
    }
    </style>
</head>
<body>
    <table>
        <caption>Lenda da táboa</caption>
        <thead>
            <tr>
                <th colspan="2" scope="col">ano</th>    
                <th scope="col">webs</th>
                <th scope="col">páxinas</th>
                <th scope="col">Liñas</th>
            </tr>
        </thead>
        <tbody>
            <tr>
            <th data-title="ano" scope="row">1</th>
            <th data-title="ano" scope="row">2</th>
            <td>3</td>
            <td>4</td>
            <td rowspan="2">5</td>
            </tr>
            <tr>  
            <th data-title="ano" scope="row">6</th>
            <th data-title="ano" scope="row">7</th>
            <td>8</td>
            <td>9</td>
            
            </tr>  
        </tbody>
    </table>
</body>
</html>