Tag HTML <estilo>
Exemplo
Uso do elemento <style> para aplicar uma folha de estilo simples a um documento HTML:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph.</p>
</body>
</html>
Mais exemplos de "Experimente você mesmo" abaixo.
Definição e uso
A <style>
tag é usada para definir informações de estilo (CSS) para um documento.
Dentro do <style>
elemento, você especifica como os elementos HTML devem ser renderizados em um navegador.
Dicas e Notas
Nota: Quando um navegador lê uma folha de estilo, ele irá formatar o documento HTML de acordo com as informações da folha de estilo. Se algumas propriedades foram definidas para o mesmo seletor (elemento) em diferentes folhas de estilo, será usado o valor da última folha de estilo lida (veja o exemplo abaixo)!
Dica: Para vincular a uma folha de estilo externa, use a tag <link> .
Dica: Para saber mais sobre folhas de estilo, leia nosso Tutorial de CSS .
Suporte ao navegador
Element | |||||
---|---|---|---|---|---|
<style> | Yes | Yes | Yes | Yes | Yes |
Atributos
Attribute | Value | Description |
---|---|---|
media | media_query | Specifies what media/device the media resource is optimized for |
type | text/css | Specifies the media type of the <style> tag |
Atributos Globais
A <style>
tag também suporta os Atributos Globais em HTML .
Atributos do evento
A <style>
tag também suporta os atributos de evento em HTML .
Mais exemplos
Exemplo
Vários estilos para os mesmos elementos:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
<style>
h1 {color:green;}
p {color:pink;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This
is a paragraph.</p>
</body>
</html>
Páginas relacionadas
Curso HTML: HTML CSS
Tutorial de CSS : Tutorial de CSS
Referência HTML DOM: objeto de estilo
Configurações padrão de CSS
A maioria dos navegadores exibirá o <style>
elemento com os seguintes valores padrão:
style {
display: none;
}