2 de fev de 2012

Dicas de formatação em HTML para o ORKUT



Dicas de formatação em HTML para serem utilizadas no Orkut ou em outros sites que aceitem essa linguagem.







INCLUIR IMAGEM

<img src="endereço da imagem" width="157" height="70" alt="Logotipo">
Você pode mudar a largura (width) e a altura da imagem. A mensagem contida no campo alt (logotipo) será mostrada caso a imagem não possa ser carregada por algum motivo..
Imagem carregada corretamente: Logotipo
Imagem não carregada (aparece o texto): Logotipo




TEXTO CENTRALIZADO

<div align="center"> SEU TEXTO AQUI </div>
Seu texto ficará centralizado no seu post. Use <center> como tag rápido.

AMY LEE OFICIAL



TEXTO À DIREITA

<div align="right"> SEU TEXTO AQUI </div>
Seu texto ficará à direita do seu post.

AMY LEE OFICIAL



NEGRITO, SUBLINHADO, ITÁLICO E TACHADO

<b> SEU TEXTO EM NEGRITO </b>
<u> SEU TEXTO SUBLINHADO </u>
<i> SEU TEXTO EM ITÁLICO </i>
<s> SEU TEXTO TACHADO </s>
Seu texto ficará negrito, sublinhado, itálico ou tachado de acordo com as tags b, u, i, s.

AMY LEE OFICIAL 
AMY LEE OFICIAL 
AMY LEE OFICIAL
AMY LEE OFICIAL


TEXTO QUE PISCA

Seu texto ficará piscando. (O codigo não funciona no navegador Google Chrome)
AMY LEE OFICIAL


TEXTO EM EXPOENTE E ÍNDICE

<sup> SEU TEXTO AQUI (EXPOENTE) </sup>
<sub> SEU TEXTO AQUI (ÍNDICE) </sub>
Seu texto ficará em estilo expoente se usar as tags <sup> ou ficará em estilo índice se usar as tags <sub>.

AMY LEE OFICIAL EXPOENTE 
AMY LEE OFICIAL ÍNDICE 


PULAR LINHAS

<br> ou <p>

Às vezes, quando postamos um código HTML, a gente tenta dar vários enter para poder "pular" de linha. Não importa o tanto que fazemos, o proprio codigo HTML impede isso. Então, quanto mais linhas quiser pular, só colocar essa tag quanta vezes quiser. É simples.
 



FONTE

<font face="NOME_DA_FONTE"> SEU TEXTO AQUI </font>


Com este codigo você pode mudar a fonte do texto. Válido somente com fontes originais do windows. 

Amy Lee Oficial




COR

<font color="CÓDIGO HTML DA COR"> SEU TEXTO AQUI </font>
Com este codigo você muda as cores do texto, lembrando que o mesmo só aceita codigos de cores em hexadecimal. Em breve você pode consultar a tabela de cores.

AMY LEE OFICIAL


TAMANHO

<font size="TAMANHO"> SEU TEXTO AQUI </font>
Com este codigo você muda o tamanho do texto. Os tamanhos variam de 1 á 7.

AMY LEE OFICIAL




DIMINUINDO TEXTO

<small> SEU TEXTO AQUI </small>
Usando essa tag fácil e rápida, seu texto ficará menor. Use quantas vezes quiser até diminuir ao tamanho desejado - lembrando sempre de fechar todas as tags.

RESULTADO: AMY LEE OFICIAL




AUMENTANDO TEXTO

<big> SEU TEXTO AQUI </big>

Usando essa tag fácil e rápida, seu texto ficará maior. Use quantas vezes quiser até aumentar ao tamanho desejado - lembrando sempre de fechar todas as tags.

RESULTADO: AMY LEE OFICIAL




CITAÇÃO

<blockquote> SEU TEXTO AQUI </blockquote>


Blockquote é uma tag onde se cria margem em ambos os lados do seu texto. funciona quase como a ferramenta "Récuo" de programas como Microsoft Office Word.
AMY LEE OFICIAL
CITAÇÃO 2
<
blockquote><table cellspacing="5"><tr valign="top" align="left"><td width="6" bgcolor="COR_HTML"><BR></td><td width="500" valign="top" align="left"><p> SEU_TEXTO_AQUI </span></p></td></tr></table></blockquot
e>
Blockquote é uma tag onde se cria margem em ambos os lados do seu texto. funciona quase como a ferramenta "Récuo" de programas como Microsoft Office Word. Coloque seu texto em SEU_TEXTO_AQUI e mude a cor da tag de citação em COR_HTML



I can feel the night beginning
Separate me from the living
Understanding me after all I've seen
Piecing every thought together
Find the words to make me better
If I only knew how to pull myself apart

BARRA DE SEPARAÇÃO HORIZONTAL

<hr size="TAMANHO" width="LARGURA_EM_PIXEL" align="center" color="COR_HTML">

Você pode mudar a cor (color), o alinhamento (align), o tamanho (size) e a largura (width). Na parte da cor, consulte o tópico de cores html; No alinhamento, você pode colocar right (direita), left (esquerda) ou center(central); Na largura, podes colocar o tamanho em porcentagem (100% é tamanho máximo) ou se quiser, tire o sinal de porcentagem (%) para definir largura em pixel; Na parte tamanho, você coloca o numero de pixel que quiser de tamanho.




FUNDO COLORIDO

<table bgcolor="COR HTML"> SEU TEXTO AQUI </table>

Seu fundo ficará colorido. Para quem não sabe, bgcolor é a cor do fundo.
PS: Você só verá o fundo colorido depois que fizer o post.


BORDA E FUNDO COLORIDOS

<table border="1" bgcolor="COR HTML"> SEU TEXTO AQUI </table>

Seu texto ficará com a borda e o fundo coloridos. Para quem não sabe, bgcolor é a cor do fundo. Você pode mudar também a espessura da borda que é 1 para um número maior.
PS: Você só verá o fundo colorido depois que fizer o post.


BORDA NO TEXTO

<table border="1"> SEU TEXTO AQUI </table>

Seu texto ficará com uma borda. Se quiser, pode mudar o 1 para o tamanho que quiser de borda. Pode se usar o código para imagens, se quiser.
PS: Você só verá o fundo colorido depois que fizer o post.



BORDA E FUNDO DE CORES DIFERENTES

<table border="1" bgcolor="COR DA BORDA"><td bgcolor="COR DO FUNDO"> SEU TEXTO AQUI </td></table>


Seu texto ficará com a borda de uma cor e o fundo de outra cor, de acordo como preferir. A parte table border="ESPESSURA_DA_BORDA" é a parte onde é a formatação da borda e na partebgcolor="COR_DO_FUNDO" é a cor da borda. Na parte td color="COR_DE_FUNDO" é a parte da cor do fundo da caixa.



BORDA E FUNDO DE CORES DIFERENTES

<table border="1" bgcolor="COR DA BORDA"><td bgcolor="COR DO FUNDO"> SEU TEXTO AQUI </td></table>

Seu texto ficará com a borda de uma cor e o fundo de outra cor, de acordo como preferir. A parte table border="ESPESSURA_DA_BORDA" é a parte onde é a formatação da borda e na partebgcolor="COR_DO_FUNDO" é a cor da borda. Na parte td color="COR_DE_FUNDO" é a parte da cor do fundo da caixa.


AMY LEE OFICIAL

LETRA DE MÃO

<span style="font-family:FRENCH SCRIPT MT; font-size:30"> SEU TEXTO AQUI </span style>

Amy Lee Oficial



ESTILO MAQUINA DE ESCREVER

<tt> SEU TEXTO AQUI </tt>

Amy Lee Oficial



TEXTO TRANSPARENTE

<font color=#F0F6FF> SEU TEXTO AQUI </font>

Para ver o texto escrito selecione com o mouse abaixo.

AMY LEE OFICIAL


LINHA HORIZONTAL

<hr>

Use a tag acima para criar uma linha horizontal.




ESPAÇAMENTOS

&nbsp;

Insere o caractere "space". Não é possível colocar mais que um espaço consecutivo usando texto, entretanto, com esse código já é possível fazer.
             AMY LEE OFICIAL


SOMBREAMENTO

<div style="color: COR_DO_TEXTO; text-shadow: COR_DA_SOMBRA 1px 3px 2px;"> SEU TEXTO AQUI </div>

Os números 1px = A distância horizontal (X) entre o texto e a sombra, 2px - A distância vertical (Y) entre o texto e a sombra e 0px - Efeito blur (borrado). Você pode mudar a cor do texto onde está marcado, e a cor da sombra.

AMY LEE OFICIAL


PALAVRA MÁGICA

<span title="AMY LEE OFICIAL"> PASSE O MOUSE E ESPERE </span>

Ao deixar o mouse parado no texto, revelará uma mensagem. Podes mudar a mensagem (title) e o texto onde as pessoas passarão o mouse.
PASSE O MOUSE E ESPERE 



TEXTO LADO A LADO

<table>
DIGITE O TEXTO 1 AQUI </td><td> DIGITE O TEXTO 2 AQUI </td></tr></table>

Com esse código, você poderá colocar seus textos lado a lado, como páginas de livro. 
Swallowed up in the sound of my screaming
Cannot cease for the fear of silent nights
Oh, how I long for the deep sleep dreaming
The goddess of imaginary light
In my field of paper flowers
And candy clouds of lullaby (paper flowers)
I lie inside myself for hours
And watch my purple sky fly over me (paper flowers)


BORDAS VARIADAS

<div style="border-width:TAMANHO_DA_BORDA; width: LARGURA; height: ALTURA; border-color:COR_DA_BORDA; border-style: ESTILO_DA_BORDA"> SEU_TEXTO </div>

Em TAMANHO_DA_BORDA mude o tamanho dela em pixels (1, 2, 3 etc). Em LARGURA e ALTURA coloque o respectivo valor de cada um deles em forma de pixels (200, 300, 400 etc). Em COR_DA_BORDA mude a cor dela. EmESTILO_DA_BORDA mude o estilo dela de acordo com os exemplos:












SOLID














DASHED













DOTTED














DOUBLE















RIDGE















INSET




BARRA DE ROLAGEM

< pre >< div style="border: 1px solid rgb(205, 211, 218); padding: 5px; overflow: auto; background-color: rgb(247, 248, 249);"> ESCREVA AQUI UM TEXTO LONGO < /div>

Escreva um texto longo (pode usar cores e fontes) para que apareça a barra de rolagem, e pode também conter imagens. Você pode mudar as cores da caixa. Para mudar, consulte a tabela de cores, e apenas substitua os valores rgb (como no exemplo 205, 211, 218 e 247, 248, 249). Os códigos dessas cores são JAVA, então pegue o Código Java da cor escolhida na tabela de cores e separe os valores por vígula. Podes definir o tamanho da borda em pixel, na parte border: 1px, e/ou colocar no lugar de solid, a palavra dashed para ficar pontilhada a borda. E podes também tirar a tag < pre > se quiser tirar a barra para ficar somente um quadrado legalzinho. 
 
Embora eu me sacrificasse, Tu não vais esforçar-te por mim, não agora. Embora eu morresse para saber que me amas, Eu estou completamente só. Ninguém está a sentir a minha falta?

BARRA DE ROLAGEM VERTICAL

< div style="overflow:auto; color:#000000; width:350px; text-align:center; font-family:arial; font-size:20px; line-height:100%" > SEU TEXTO AQUI

Explicando:
• #000000 = Cor do teu texto.
• 350px = Largura da caixa com a barrinha de rolagem vertical.
• center = Como o texto ficará. Pode colocar "right", "center", "normal" ou "justify".
• arial = Nome da sua fonte dentro daquela caixa.
• 20px = Tamanho da sua fonte.
• 100% = Espaço entre as linhas.










Por favor, por favor perdoa-me
Mas eu não estarei em casa novamente
Talvez um dia tu olhes para cima
E meio consciente tu digas a alguém
Não está a faltar alguma coisa?

BORDA E FUNDO DE CORES DIFERENTES II   
    
< div style="border:2px solid rgb(0, 0, 0);padding:1px;width:302px;background-co
lor:rgb(142, 229, 238)"> SEU_TEXTO
    
A parte de "border:xpx" determinará a largura da sua borda. Entre parênteses, coloque a numeração da cor em código RGB, cujo primeira cor é da borda e o segundo do fundo. Em "width:xxxpx" você coloca a largura da sua table. Em "solid" você pode mudar para: ridge, dotted, solid, inset e double.   
    






AMY LEE OFICIAL AMY LEE OFICIAL
   







Related Posts Plugin for WordPress, Blogger...