orientation
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since juillet 2015.
orientation est une caractéristique média CSS (cf. @media) qui peut être utilisée pour vérifier l'orientation de la zone d'affichage (viewport) (ou la boîte de la page pour les média paginés).
Syntaxe
La caractéristique orientation se définit grâce à l'un des mots-clés suivants :
Exemples
HTML
html
<div>Boîte 1</div>
<div>Boîte 2</div>
<div>Boîte 3</div>
CSS
css
body {
display: flex;
}
div {
background: yellow;
}
@media (orientation: landscape) {
body {
flex-direction: row;
}
}
@media (orientation: portrait) {
body {
flex-direction: column;
}
}
Résultat
Spécifications
| Specification |
|---|
| Media Queries Level 4 # orientation |
Compatibilité des navigateurs
Loading…