Páginas

30 de set. de 2015

Como alinhar várias imagens dentro da postagem

Galinha Pintadinha
Baratas
Pintinho
Sapo




Como posso alinhar várias imagens nos posts do blog? A solução é antiga, mas ainda assim é uma solução. O ruim é ter que sempre ficar colando esse código no HTML na área de postagem do Blogger, trocar código, inserir links... Mas para quem quer um blog bem cuidado, com tudo em seu devido lugar, não vai acha que isso é tão trabalhoso assim.

Copie  o código e cole no editor de postagens no Modo HTML



<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>  

Nenhum comentário:

Postar um comentário