Carregando atualizações...

X
DH
E foi assim que aconteceu...
DH
A MULHER DOS SEUS SONHOS
Ana Otani e Sarah Caus em Live amadora no Instagram
Ana Otani e Sarah Caus em Live amadora no Instagram
Bella da Semana Mika
Bella da Semana Mika
Branquinha
Casal diferenciado
Garota linda ficando na webcam
Garota linda ficando na webcam
O tema de aniversario mais insano…
O tema de aniversario mais insano…
Negra muito gata peladona
Negra muito gata peladona
20 cosplayers muito bem feitas
20 cosplayers muito bem feitas
Novinha linda gravou peladinha na academia
Novinha linda gravou peladinha na academia
Whatsapp do SX
Whatsapp do SX

>

Criar Uma Tabela Apenas Usando Técnicas HTML e CSS

Nesta postagem compartilho com vocês mais uma dica interessante para você que tem um blog de variedades e deseja usar uma tabela em seus artigos a fim de organizar melhor a postagem, para isso existe aqui uma ótima técnica.
Veja também: Tabela CSS Personalizada Com Miniaturas de Imagens Para Vídeos


Veja uma demonstração ABAIXO:

DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot
DicasHotDicasHot

Como você pode ver na demonstração ACIMA, a tabela é muito bem estruturada e elegante.

O código da tabela é o seguinte:


<div align="center" style="background-color: white; color: #444444; font-family: Quattrocento, 'Trebuchet MS', Helvetica, sans-serif; font-size: 16.6000003814697px; line-height: 29.8800010681152px;">



<table align="center" border="1" cellpadding="3" cellspacing="0" style="border: 1px solid rgb(204, 204, 204); margin: 10px 0px 0px; padding: 0px; width: 400px;"><tbody>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



<tr><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td><td style="background: rgb(249, 249, 249); border-top-color: rgb(223, 223, 223); border-top-style: solid; border-top-width: 1px; padding: 2px 8px;" valign="top" width="200">DicasHot</td></tr>



</tbody></table>



</div>



<div align="left" style="background-color: white; color: #444444; font-family: Quattrocento, 'Trebuchet MS', Helvetica, sans-serif; font-size: 16.6000003814697px; line-height: 29.8800010681152px;">



</div>



<div>



</div>

Se você preferir, pode colocar links em cada palavra para deixar a tabela ainda melhor.

Categorias-tags:

COMENTÁRIOS FECHADO!

NOSSO CANAL
VER TV A CABO ONLINE GRÁTIS
TV ONLINE 1.0