Mais
×

Efeitos especiais de textos em HTML

Atualizado em 17 abril, 2017

O HTML e CSS podem produzir alguns efeitos legais de texto, além de formatações padrões, tais como tamanho da fonte e cor do plano de fundo. Efeitos especiais em HTML fazem com que o texto apareça e se comporte de maneiras incomuns, que chamam atenção do espectador. Utilize-os para animar uma página parada ou aumentar um texto simples.

Efeitos especiais de textos em HTML (Polka Dot RF/Polka Dot/Getty Images)

Drop Cap (letra capitular)

Em processamento de texto, um drop cat amplia a primeira letra de um parágrafo. Você pode reproduzir esse efeito em suas páginas da web utilizando o HTML e o CSS. Use a propriedade "float" (flutuar) para alinhar a letra capitular e a "font-size" (tamanho da fonte) para aumentar seu tamanho em relação ao resto do texto no parágrafo. Coloque os caracteres nas tags "span".

Exemplo:

E Esse é um exemplo de um efeito drop cap utilizando a propriedade float .

Texto rolante

O efeito "marquee" (margem) em HTML faz o texto se mover de maneiras diferentes. O comando "direction" (sentido) no código informa ao navegador para onde o texto irá se mover: cima, baixo, esquerda ou direita. O atributo "behavior"(comportamento) descreve a forma como o texto se moverá. O atributo "Scroll" (deslizar) faz o texto se mover para além da sua área visível e, em seguida, aparecer de novo. O comando "slides" faz o texto parar no final da margem, enquanto o "alternate" (alternativo) faz com que o texto se mova de um lado para o outro. Use o comando "scrollamount" (total de rolagem) para determinar a velocidade, sendo que quanto maior for o número, mais rápida será a rolagem.

Exemplo:

Rolando o texto para cima!

Título mouseover (passando o mouse por cima)

A tag span da HTML permite que um texto apareça sobre a área onde ele é inserido. Por exemplo, caso deseje acrescentar um resumo de um parágrafo, insira o texto usando a tag span.

Exemplo:

Texto do parágrafo aqui.

bibliography-icon icon for annotation tool Cite this Article