Tutorial apresentação - parte 2

Oi pessoas que tem internet, hoje eu vou continuar o tutorial de apresentações do stardoll. Se você não viu a primeira parte veja aqui

Se você quiser ir testando antes de colocar no código da sua apresentação, pode usa esse site http://htmledit.squarefree.com/ assim você pode testar uma cor etc sem ter que mudar depois

Então agora vou mostrar outros tipos de bordas para a sua apresentação:

<p style="background-color: rgb(175, 238, 238); border: 5px solid #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Solid Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px dotted #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Dotted Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px dashed #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Dashed Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px double #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Double Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px outset #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Outset Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px inset #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Inset Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px groove #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Groove Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 5px ridge #48D1CC; text-align:center; font-size: 20px;"> <font color="#20B2AA" face="century gothic">Ridge Border</font></p>

<p style="background-color: rgb(175, 238, 238); border: 3px solid #00CED1; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; text-align:center; font-size: 22px;"> <font color="#20B2AA" face="century gothic">Radius Border</font></p>

Então agora vamos entender os códigos das bordas, vou usar o da solid border como exemplo:

<p style="background-color: rgb(175, 238, 238); border: 5px solid #48D1CC; text-align:center; font-size: 20px;"><font color="#20B2AA" face="century gothic">Solid Border</font></p>

As partes em azul eu já expliquei na primeira parte do tuto, a parte em rosa é o seu texto, a parte lilás é o código da sua borda.

5px é o tamanho da borda, solid é o nome da borda (para trocar a borda você só precisa mudar o nome), #48D1CC é o código da cor que também já expliquei na primeira parte do tuto.

OBS: só use os códigos completos das bordas se você estiver fazendo sua própria apre, se estiver utilizando uma base procure no código: (Ctrl+F) border e troque o nome da borda as cores etc.

Editando a border radius

De todas as bordas a minha preferida é a border radius porque podemos combiná-la com outras bordas. Esse código que eu deixei aqui eu combinei com a solid border. Vamos ver o código:

<p style="background-color: rgb(175, 238, 238); border: 3px solid #00CED1; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; text-align:center; font-size: 22px;"><font color="#20B2AA" face="century gothic">Radius Border</font></p>

A parte em lilás é o código da outra borda que eu combinei com a redonda, se eu quiser colocar a radius + dotted é só mudar solid e colocar dotted. Também da pra deixar só a borda redonda apagando toda a parte do código que está em lilás. As partes em rosa definem o tamanho da borda redonda.

Vamos falar sobre as fontes e o texto

Efeitos no texto como negrito e itálico você pode colocar no próprio site:

Um efeito bem legal é o blink ele deixa o texto piscando (só funciona no navegador Mozilla Firefox)
visualize aqui http://www.wittyprofiles.com/q/6596835

Código do efeito
  <span style="text-decoration: blink">seu texto aqui</span>

Para usar o efeito copie e cole o código depois do tipo da letra assim:

Se for colocar o efeito em uma parte do texto que você já escreveu deixe o código assim: <span style="text-decoration: blink">

Tipos de fontes

Existem muitas fontes diferentes na internet mas nem todas são aceitas no stardoll. Você pode baixar algumas nesses sites http://www.dafont.com/ ou www.netfontes.com.br e ir experimentando numa fake no stardoll

Eu separei aqui o nome de algumas que funcionam clique aqui

Então é isso gente, espero que tenham gostado e entendido.