.svg)
Qu'est-ce que aspect-ratio en CSS ?
La propriété CSS aspect-ratio définit un rapport largeur/hauteur préféré pour un élément. Elle permet de maintenir des proportions constantes sans recourir au padding-bottom hack. Elle simplifie la gestion des ratios d'images, vidéos et conteneurs responsives.
Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Syntaxe et fonctionnement
aspect-ratio: 16 / 9; pour widescreen, 1 / 1; pour un carré, 4 / 3; pour classique. La propriété fonctionne sur tous les éléments.
Cas d'usage
Conteneurs d'images responsives, placeholders de chargement, grilles de cartes uniformes, et intégrations vidéo. Combiné avec object-fit: cover, on obtient des images parfaitement cadrées.
Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Conclusion
Aspect-ratio est une propriété CSS moderne qui élimine les hacks historiques pour maintenir les proportions et garantit des mises en page cohérentes sur tous les écrans.
À retenir
- Rapport largeur/hauteur pour tout élément
- Syntaxe : 16/9 (widescreen), 1/1 (carré)
- Remplace le padding-bottom hack
- Combinable avec object-fit: cover
- Supporté par tous les navigateurs modernes
Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
