Tag HTML <stile>


Esempio

Utilizzo dell'elemento <style> per applicare un semplice foglio di stile a un documento HTML:

<html>
<head>
<style>
  h1 {color:red;}
  p {color:blue;}
</style>
</head>
<body>

<h1>A heading</h1>
<p>A paragraph.</p>

</body>
</html>

Altri esempi "Provalo da solo" di seguito.


Definizione e utilizzo

Il <style>tag viene utilizzato per definire le informazioni di stile (CSS) per un documento.

All'interno <style>dell'elemento specifichi come devono essere visualizzati gli elementi HTML in un browser.


Suggerimenti e note

Nota: quando un browser legge un foglio di stile, formatterà il documento HTML in base alle informazioni nel foglio di stile. Se alcune proprietà sono state definite per lo stesso selettore (elemento) in fogli di stile diversi, verrà utilizzato il valore dell'ultimo foglio di stile letto (vedi esempio sotto)!

Suggerimento: per creare un collegamento a un foglio di stile esterno, utilizza il tag <link> .

Suggerimento: per saperne di più sui fogli di stile, leggi il nostro tutorial CSS .


Supporto browser

Element
<style> Yes Yes Yes Yes Yes


Attributi

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

Attributi globali

Il <style>tag supporta anche gli attributi globali in HTML .


Attributi dell'evento

Il <style>tag supporta anche gli attributi dell'evento in HTML .


Altri esempi

Esempio

Stili multipli per gli stessi elementi:

<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>

Pagine correlate

Esercitazione HTML: HTML CSS

Esercitazione CSS : Esercitazione CSS

Riferimento HTML DOM: Style Object


Impostazioni CSS predefinite

La maggior parte dei browser visualizzerà l' <style>elemento con i seguenti valori predefiniti:

style {
  display: none;
}