Saiba como: "Alinhar várias imagens no post com tabela"

"Alinhar várias imagens no post com tabela"




..."alinhar várias imagens nos posts do blog."

" Aí está uma solução. "

"Antiga, em desuso, mas ainda assim uma solução. "

"O ruim é ter que sempre ficar colando esse código no HTML da área de postagem do Blogger, trocar código, inserir links...ufa, quanto trabalho !" 
"Mas quem gosta de um blog bem cuidado, com tudo em seu devido lugar, acha que isso nem é tão trabalhoso assim."




 No 
editor de postagens no Modo HTML;


    copie  e cole, o código a seguir:







<table border="0" bordercolor="”blue”" style="height: ”80%”px;" whidth="”">

<tbody>
<tr>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 1" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 1" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 2" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 2" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 3" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 3" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 4" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 4" height="130" width="200" /></a></div>
</td>


</tr>
<tr>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 5" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 5" height="130" width="200" /></a></div>
</td>


<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 6" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 6" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 7" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 7" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 8" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 8" height="130" width="200" /></a></div>
</td>


</tr>
<tr>


<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 9" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 9" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 10" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 10" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 11" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 11" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 12" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 12" height="130" width="200" /></a></div>
</td>

</tr>
</tbody></table> 


  



///



fonte e créditos: 
templateseacessorios 

Nenhum comentário


Mensagem do formulário de comentário:

Tecnologia do Blogger.