Estilo HTML

A propriedade style é usada para alterar o estilo dos elementos HTML.

Este texto está em Verdana e vermelho
Este texto está em Times e azul
Este texto tem 30 pixels de altura

Experimente pessoalmente

Propriedade style do HTML

Função da propriedade style:

Fornece um método geral para alterar o estilo de todos os elementos HTML.

O estilo foi introduzido no HTML 4 como uma nova maneira preferida de alterar o estilo dos elementos HTML. Através do estilo HTML, é possível adicionar estilos diretamente aos elementos HTML usando a propriedade style ou indiretamente em uma tabela de estilo independente (arquivo CSS).

Você pode encontrar em nosso Tutorial de CSSAprenda tudo sobre estilo e CSS aqui.

Nossa lição de HTML, usaremos a propriedade style para explicar o estilo HTML.

Elementos e propriedades não recomendados

No HTML 4, vários elementos e propriedades foram descontinuados. Descontinuado (Deprecated) significa que essas tags e propriedades não serão suportadas nas versões futuras do HTML e XHTML.

A mensagem transmitida é clara: evite usar esses elementos e propriedades descontinuados!

Deve evitar usar os seguintes elementos e propriedades:

Tag Descrição
<center> Definir conteúdo centralizado.
<font> e <basefont> Definir a fonte HTML.
<s> e <strike> Definir texto riscado
<u> Definir texto sublinhado
Propriedade Descrição
align Definir alinhamento do texto
bgcolor Definir cor de fundo
color Definir cor do texto

Para os seguintes elementos e propriedades: use estilos em vez disso!

Exemplo de estilo HTML - Cor de fundo

A propriedade background-color define a cor de fundo do elemento:

<html>
<body style="background-color:yellow">
<h2 style="background-color:red">Este é um título</h2>
<p style="background-color:green">Este é um parágrafo.</p>
</body>
</html>

Experimente pessoalmente

A propriedade style substituiu a antiga propriedade bgcolor.

Experimente pessoalmente: o método antigo de definição de cor de fundo

Exemplo de estilo HTML - Fonte, cor e tamanho

As propriedades font-family, color e font-size definem respectivamente a família de caracteres, a cor e o tamanho da fonte do texto do elemento:

<html>
<body>
<h1 style="font-family:verdana">Um título</h1>
<p style="font-family:arial;color:red;font-size:20px;">Um parágrafo.</p>
</body>
</html>

Experimente pessoalmente

A propriedade style substituiu a antiga tag <font>.

Experimente pessoalmente: o método antigo de definição de fonte

Exemplo de estilo HTML - Alinhamento de texto

A propriedade text-align define o alinhamento horizontal do texto do elemento:

<html>
<body>
<h1 style="text-align:center">Este é um título</h1>
<p>O título acima está alinhado ao centro desta página.</p>
</body>
</html>

Experimente pessoalmente

A propriedade style substituiu a antiga propriedade "align".

Experimente pessoalmente: o método antigo de alinhamento central