Curso de Formatação Intermediário- Lição 14- Papel de carta com tabela na lateral

Este é dos recursos que, particularmente, considero muito bonito e prático em formatações simples de e-mails.

Veja um exemplo aqui para ficar mais fácil entender o que estou falando.

Gostou?

Vamos lá!

1. Abra uma nova mensagem

2. Clique na aba "Origem"

3. Cole o seguinte código, logo depois de</HEAD> (ou antes de </BODY></HTML>)


<STYLE type=text/css>
<!-
a (text-decoration:none)
//->
</STYLE>
</HEAD>
<BODY bgColor=#e5d6c1
background="endereço da imagem de fundo algo do tipo C:\Arquivos de programas\Arquivos comuns\Microsoft Shared\Papel de carta\estirado.jpg">
<TABLE style="FILTER: Alpha(Opacity=60) WIDTH: 472px; HEIGHT: 63px"
borderColor=#755421 cellSpacing=8 cellPadding=12 width=420 align=right
bgColor=#f7ecdb border=6>

<TBODY>
<TR>
<TD width="100%">
<DIV align=center><FONT face=Georgia color=#917b2f size=4><STRONG>Escrever
o texto aqui</STRONG></FONT></DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4>tabela</FONT></STRONG></DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f
size=4></FONT></STRONG>&nbsp;</DIV>
<DIV align=center><STRONG><FONT face=Georgia color=#917b2f><A
href="http://ilove.com.br/lili/"></A></FONT></STRONG>&nbsp;</DIV></TD></TR></TBODY></TABLE>


Neste código, já deixei um espaço com a indicação do lugar em que deve aparecer o endereço do papel de carta. (em vermelho). Faça a substituição corretamente, inserindo o endereço de seu papel de carta a ser utilizado nesta aula.

Os dados que deixei em verde no código referem-se à tabela:

<TABLE style="FILTER: Alpha(Opacity=60) WIDTH: 472px; HEIGHT: 63px"
borderColor=#755421 cellSpacing=8 cellPadding=12 width=420 align=right
bgColor=#f7ecdb border=6>

Você pode alterar a opacidade (Opacity=60) quanto maior o número, menos transparente ela fica.

Pode alterar também a largura WIDTH: 472px; e a altura HEIGHT: 63px;

A cor da borda da tabela borderColor=#755421;

O alinhamento align=right;

A cor do fundo da tabela bgColor=#f7ecdb;

A espessura da borda da tabela border=6

Faça as alterações na tabela de acordo com o seu papel de carta. Escolha as cores, o alinhamento, a espessura da borda e o tamanho da tabela de forma que o conjunto papel de carta/tabela/texto fique bem harmônico. Lembre-se de deixar seu texto visível. Um dos recursos é diminuir a transparência (opacidade) da tabela.

Escreva algumas palavras (na tabela) e envie o e-mail para o grupo.

Importante: Insira seu cartão de visitas!

Endereço do grupo: tutorial_emails@yahoogrupos.com.br

Lembre-se de indicar no campo Assunto: Nome do aluno, Nível e Número da lição. Caso a lição tenha sido refeita, inclua a palavra "refeita".

Lição elaborada por Lilian Russo

Lilian Russo - Todos os Direitos Reservados - ©2002/2008




.