Coisas úteis para apresentações em jogos como howrse e stardoll!

Oi gente!
Quando eu comecei a jogar howrse queria fazer uma apresentação q fosse a minha cara mas não tinha idéia de como fazer e nem entendia de HTML mas fuçando um poko e com ajuda de alguns códigos fáceis e de apresentações do stardoll (q eu tbm jogava ^^) consegui não só o resultado q queria mas tbm aprendi um poko sobre o tal HTML e se eu consegui qualquer um consegue então vim trazer um poko do meu aprendizado pra vcs!

♥ Tabelas de cores por nome e código:

http://www.flextool.com.br/tabela_cores.html

http://www.immigration-usa.com/html_colors.html

♠ Site onde vc monta a apre antes de mandar pro jogo:

http://htmledit.squarefree.com/

♦ Código para fundo colorido:

<div style="background-color: colocar código de cor ; text-align: center;">Texto qualquer</div>

Exemplo:

Texto qualquer

♣ Código para fundo com imagem:

<div style="margin: 0 auto; background: url(endereço da imagem q quer "url" a imagem tem q estar na internet);width:700px; height:700px; top: 0px; left: 0px;"><div align="center">

Exemplo:

Dica: escolha imagens do tamanho de sua apre se escolher pequena ela vai se repetir e se for grande demais vai ser cortada. (stardoll só aceita imagem do jogo tipo as fotos tiradas no jogo! -.-)

♥ Bordas para apresentação:

 Groove border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 5px groove nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>

Ridge border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 8px ridge nome ou código da cor para borda; padding: 15px; text-align: left;">Text Here</p>

Inset border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 4px inset nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>

Double border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 4px double nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>

Solid border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 4px solid  nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>

Dotted border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 4px dotted  nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>

Dashed border

<p style="line-height: 15px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 14px; border: 1px dashed  nome ou código da cor para borda; padding: 15px; text-align: left;">Text here</p>


♠  Código para caixa de rolagem:

Dashed
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 2px dashed nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Solid
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 2px solid nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Dotted
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 2px dotted nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Double
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 4px double nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Inset
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 4px inset nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Groove
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 5px groove nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>

Ridge
Border, Height: 300px Width 200px
---------------------------------------------Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here Text Here Text Here 
Text Here

<p style="line-height: 12px; background-color: nome ou código da cor de fundo; margin: 0px;  font-family: 'Century Gothic'; font-size: 11px; padding: 0px;  text-align: left; border: 8px ridge nome ou código da cor para borda; margin: auto; padding:  5px; overflow: auto; white-space: pre-wrap; word-wrap: break-word;  width: 200px; height: 300px;">Text Here</p>


♦ Código para letra que pisca (só pisca no firefox!):

<p style="text-align: center; font-family: Roman; font-size: 35px; text-decoration: blink;"><b><font color="nome ou código da cor">Text Here!</font></b></p>

Exemplo:

Lunatic Maniak!

 ♣ Código para tabela:
 
<table>
<tr>
<td>TEXT 1</td>
<td>TEXT 2</td>
<td>TEXT 3</td>
</tr>
<tr>
<td>TEXT 4</td>
<td>TEXT 5</td>
<td>TEXT 6</td>
</tr>
</table>

Esse código é importante pq ele divide sua apresentação ele que é responsável por colocar as coisas tipo caixa de texto ou imagens uma do lado da outra em vez de embaixo. ^^

Exemplo:

	Então gente é para isso q serve a tabela, separar e organizar as coisas que vc quer colocar na sua apresentação, os text de 1 a 3 são os da linha de cima e os de 4 a 6 os da de baixo! ^^	Comentem! Sua opinião é importante!
Dicas pra hr de editar! <br> serve para bular linhas width: o nº dele se refere a largura height: o nº dele se refere a altura font-size: se refere ao tamanho da letra line-height: se refere a distancia entre linha border: se refere a largura da borda font-family: onde vc muda o tipo de letra	Acho q isso é td, espero ter sido útil e q vcs tenham gostado!

♥ Código para imagem simples:

<img src="endereço da imagem q quer "url" a imagem tem q estar na internet">

Exemplo: