<HTML> #CSS

<style> permet d’ajouter du code CSS à la page HTML en cours
Ce code CSS ne sera appliqué qu’à la page courante

Code

Aperçu dans le navigateur

<style> utilise les attributs globaux

media

Indique pour quel périphérique, le code CSS est destiné.
Possibilité d'indiquer plusieurs média
Les opérateurs and (et), not (sauf) et , (ou) permettent de les joindre ou d'affiner la zone de sortie

Valeurs des périphériques de sortie

Valeur	Description	Infos
all	Valeur par defaut Correspond à tous les appareils, tout les écrans
all	`<style media="all">code css</style>` <style media="all">p { color: green; }</style>
screen	Correspond aux écrans d'ordinateur
screen	`<style media="screen">code css</style>` <style media="screen">p { color: #F00; }</style>
print	Correspond au rendu à l'impression et à la prévisualisation avant impression
print	`<style media="print">code css</style>` <style media="print">.intro { color: #C9C9C9; }</style>

<style media="valeur">Code Css</style>

Valeur	Description	Infos
aspect-ratio	Spécifie le rapport largeur / hauteur de la zone d'affichage Les préfixes "min-" et "max-" peuvent être utilisés
aspect-ratio	`<style media="zone d'affichage opérateur (aspect-ratio: valeur)">` <style media="screen and (aspect-ratio: 16/9)">p { color: #F00; }</style>
width	Correspond à la largeur de la zone d'affichage Les préfixes "min-" et "max-" peuvent être utilisés
width	`<style media="zone d'affichage opérateur (width: valeur)">` <style media="print and (max-width: 500px)">p { color: #F00; }</style>
height	Correspond à la hauteur de la zone d'affichage Les préfixes "min-" et "max-" peuvent être utilisés
height	`<style media="zone d'affichage opérateur (height: valeur)">` <style media="screen and (min-height: 500px)">p { color: #F00; }</style>
color	Correspond au nombre de bits par couleur de l'affichage Les préfixes "min-" et "max-" peuvent être utilisés
color	`<style media="zone d'affichage opérateur (color: valeur)">` <style media="print and (min-color: 3)">p { color: #F00; }</style>
color-index	Indique le nombre de couleur que l'affichage peut gérer Les préfixes "min-" et "max-" peuvent être utilisés
color-index	`<style media="zone d'affichage opérateur (color-index: valeur)">` <style media="screen and (max-color-index: 256)">p { color: #F00; }</style>
monochrome	Indique le nombre de bits par pixel utilisés pour l'affichage monochrome de l'appareil Les préfixes "min-" et "max-" peuvent être utilisés
monochrome	`<style media="zone d'affichage opérateur (monochrome: valeur)">` <style media="screen and (min-monochrome: 2)">p { color: #F00; }</style>
grid	Indique si le périphérique fonctionne grâce à une grille ou une matrice bitmap 1 : grille 0 : matrice bitmap
grid	`<style media="zone d'affichage opérateur (grid: valeur)">` <style media="screen and (grid: 1)">p { color: #F00; }</style>
orientation	Spécifie le mode d'orientation de l'affichage de l'appareil landscape : mode paysage portrait : mode portrait
orientation	`<style media="zone d'affichage opérateur (orientation: valeur)">` <style media="print and (orientation: landscape)">p { color: #F00; }</style>
resolution	Indique la résolution de l'affichage (densité de pixels) de l'appareil valeurs en dpi ou dpcm Les préfixes "min-" et "max-" peuvent être utilisés
resolution	`<style media="zone d'affichage opérateur (resolution: valeur)">` <style media="print and (max-resolution: 72dpi)">p { color: #F00; }</style>
scan	Détermine le processus utilisé pour composer l'image sur l'appareil interlace : image composée de lignes entrelacées progressive : image composée par un balayage progressif
scan	`<style media="zone d'affichage opérateur (scan: valeur)">` <style media="screen and (scan: interlace)">p { color: #F00; }</style>

style {
  display: none;
}