Aqui estão raros, úteis e bonitos códigos html para texto,imagens e links. Alguns exemplos: código marquee,tag acronym,link mailto e botão submit com imagem ...são alguns deles. Veja abaixo:(Para a melhor visualização dos códigos, deixe a página carregar por completo)
1) HTML- Códigos Marquee
O código marquee é um texto ou imagem em movimento. Se você quiser chamar atenção use o código marquee. Mas não abuse, pois pode tornar-se irritante e desconcentrar o leitor. Seria útil para mostrar atualização, para post populares e anúncios.
Exemplo 1- Texto pra-lá-pra-cá
<marquee behavior=alternate width="190"
scrollamount="7" scrolldelay="96" height="20"
bgcolor="#E0FFFF"><font size="5">Seu texto aqui</font></marquee>
Exemplo 2: Scrolling text
<marquee direction=up scrollAmount=0scrollDelay=0 style="filter:wave(add=13,phase=1,freq=3,strength=25)" width=100 height=220><font style="font-family:arial; comic sans ms;font-size:20px;color:.000000"> <b><br>S<br>E<br<br>Q<br>U<br>E<br> L<br>A<br>N<br>E<br>T</font></marquee>
Exemplo 3: Scrolling Text
<marquee direction="right"
bgcolor="#E0FFFF">Marquee é uma espécie de Letreiro </marquee>
WIDTH: define a largura
HEIGHT: define a altura
DIRECTION: a direção que o letreiro deve rolar
BEHAVIOR: a fonte (type) da rolagem
SCROLLDELAY: o tempo de resposta em cada delay
SCROLLAMOUNT: como fará o loop
LOOP: a medida do loop
BGCOLOR: cor do background
HSPACE: espaço horizontal em torno do marquee
VSPACE: espaço vertical em torno da marquee
Se não gosta de digitar códigos, faça em Gerador de código marquee.
Mais sobre código marquee.
2)Link para E-Mail
Para fazer um simples e útil link de email, para os visitantes entrarem em contato com você, deve usar este código hml.
Exemplo 1: E-Mail Link com imagem
<a href="mailto:seuemail@gmail.com"><img alt="Código hml Email Link" height="102" src="http://hackspc.com/wp-content/uploads/2009/04/contact-us1.jpg" title="Contate-nos" width="100"/></a>
Exemplo 2: Link de email comum
Contato
<a href="mailto:seuemail@gmail.com">Contato</a>
Exemplo 3: Email Link com assunto
Enviar email!
<a href="mailto:seuemail@gmail.com?Subject=Sobre o Sequelanet">Enviar email!</a>
Obs: “mailto:seuemail@gmail.com” nesta parte do código coloque o seu endereço de email.
3)Botão "Submit" com imagem
Este simples código permite mudar o botão "submit" por uma imagem.
Sem o atributo "Value" e "img scr" ele pode ficar assim , com imagem ele fica com uma aparência melhor.
<button type="submit" name="submit" value="submit"><img src="http://hackspc.com/wp-content/uploads/2009/04/submitbutton.jpg" /></button>
4)Efeito de texto HTML para criar um logo
Veja como criar um texto logotipo com html.
Este é meu Logo Text
<p ><font size="5"><b>Este é meu <span style="background: #CCCCCC; padding: 5px 5px 5px 5px;">Logo Text</span></b></font></p>
5)Raras Tags Html
Aqui estão raras tags html, que pode ser útil em certas situações.Esses raros códigos ainda estão em uso.
Exemplo 1- Acronym
Quando você passa o mouse sobre o texto com a tag acronym, aparece abaixo do texto uma caixa com um texto explicativo. Mas nem sempre é usado para siglas. Serve também para explicar determinadas palavras.
Sequelanet
<acronym title="Um blog...">Sequelanet</acronym>
Exemplo 2: ins e del
Eu
gosto
Amo
Sequelanet
Eu <del>gosto</del> <ins>Amo</ins> Sequelanet
Exemplo 3:blockquote
<blockquote>Exemplo da tag blockquote</blockquote>
Exemplo da tag blockquote
A tag é feita para dar margem. Você pode dar estilo com CSS. Veja mais sobre a tag blockquote.
6)Criar links sem underline
Este código html te permite criar um link sem underline. Como este:
Este é o link sem underline!
<a href="http://www.sequelanet.com.br/" style="text-decoration: none">Este é o link sem underline!</a>
7)Ir para uma parte específica da página
Para você criar um link que aponta para uma parte na mesma página, igual na wikipédia, é este o código. É muito usado para criar o botão "topo", quando o visitante atinge o fim da página é só clicar no botão que voltará ao inicio. Tem a mesma função da tecla Page Up do teclado.
Topo
<a name="TOPO">Topo</a>
Em seguida, criar um link que irá direcionar o visitante para a parte da página onde está o name="TOPO"
<a href="http://www.sequelanet.com.br/2009/09/incriveis-e-raros-codigos-html.html#TOPO">Ir para o topo da página</a>
obs: coloque a cerquilha ou jogo da velha em frente ao texto da palavra em name.
Em href= coloque o link +a cerquilha+ o name (href="http://link#topo).
Ficará assim :
Ir para o topo da página
Meta refresh é um método de instruir um navegador da Web para atualizar automaticamente a página da web atual ou o quadro após um determinado intervalo de tempo, utilizando um elemento meta HTML com o http-equiv parâmetro definido para dar um "refresh" e um parâmetro de conteúdo que dão o intervalo de tempo em segundos. Também é possível instruir o navegador para buscar uma URL diferente quando a página é atualizada, incluindo a URL alternativa no parâmetro de conteúdo. Ao definir o tempo de atualização intervalo de zero (ou um valor muito baixo), isso permite atualizar meta a ser utilizada como um método de redirecionamento de URL.
Exemplo 1
<html>
<head>
<META HTTP-EQUIV="Refresh" CONTENT="0;
URL=http://www.novodominio.com.br">
<title>Redirecionar para novo site</title>
</head>
<body bgcolor="#FFFFFF">
<center>
<H2>Site foi movido! O novo endereço é</H2>
<H2><a href="http://www.novodominio.com.br/">
http://www.novodominio.com.br/</H2>
</a>
<H2>"...Espere um momento será redirecionado..."</H2>
</center>
</body>
</html>
Exemplo 2
Devem ser colocadas dentro do <head>
Atualiza a página
<meta http-equiv="refresh" content="5" />
Direciona para um site depois de 5 segundos:
<meta http-equiv="refresh"
content="5;url=http://exemplo.com/"/>
Direciona para um site imediatamente:
<meta http-equiv="refresh"
content="0;url=http://exemplo.com/"/>Fontes: Pc Hacks-Cool Html Codes - Informática na web-Marquee - Wikipédia-Meta Refresh
Leia mais: http://www.sequelanet.com.br/2009/09/incriveis-e-raros-codigos-html.html#ixzz1fuikOEGz
Sem comentários:
Enviar um comentário