THead complexa

Veremos como fazer um thead complexo.

<table>
    <caption>Produzidos x Vendidos por Loja</caption>
	<thead>
        <tr>
            <th rowspan="2"></th>
            <th colspan="2">Afonso Pena</th>
            <th colspan="2">Antônia Pereira</th>
        </tr>
        <tr>
            <th>Produzidos</th>
            <th>Vendidos</th>
            <th>Produzidos</th>
            <th>Vendidos</th>
        </tr>
  </thead>
</table>

Primeiro de tudo iremos criar o nosso table, colocando a descrição com o caption.

Criaremos o thead para começarmos o nosso cabeçalho, abrimos o tr dentro para linha e colocamos dentro deste tr 3 th, o primeiro sendo vazio.

Na próxima linha já temos os produzidos e vendidos, com o auxilio do emmet, criamos direto 4 th e colocamos os produzidos e vendidos.

Notamos que ainda está desorganizado, então usaremos o atributo rowspan="2", na primeira linha, para ocupar 2 linhas, empurrando os elementos para o lado.

Agora vemos que sobrou 2 colunas vazias, então usaremos o atributo de coluna colspan="2" nas 2 lojas.