J'essaie de créer une requête multimédia qui affiche une image si la résolution de votre écran est comprise entre une certaine taille et que je ne parviens pas à la faire fonctionner. J'utilise ce qui suit:Utilisation de requêtes multimédias
<style>
@meida (min-width: 701px) and (max-width: 5000px) {
<div="sixteen columns" align="center">
<div class="home-boxes"><img src="http://www.ursovain.com/wp-content/uploads/boxes-3.jpg">
</div>
}
</style>
Vous devez le spécifier comme dans mon exemple ci-dessous. HTML et CSS sont séparés.
<style>
@media (max-width: 600px) {
.home-boxes {
display: none;
}
}
</style>
HTML
<div class="home-boxes">
<img src="http://www.ursovain.com/wp-content/uploads/boxes-3.jpg" />
</div>
Dans mon exemple ci-dessus la requête des médias appliquera la CSS à l'intérieur quand il est la condition de l'écran est remplie. Dans ce cas, le CSS qui sera appliqué est display: none à tous les éléments avec une classe de home-boxes
Bienvenue! '@ meida' devrait être' @ media'. Et vous ne devriez pas incorporer d'éléments html dans un style, même si ce ne sont pas des éléments * vraiment * html, comme vous les avez écrits. Fondamentalement, je pense que vous avez besoin de lire la documentation ou un tutoriel sur HTML et CSS en général, parce que ce morceau de code est tout à fait foiré. – GolezTrol
Vous recherchez Javascript, pas CSS. – Mike
Une solution javascript utiliserait Matchmedia, https://developer.mozilla.org/en-US/docs/Web/API/Window.matchMedia –