5545 sujets

Sémantique web et HTML

[Résolu] Cacher une image sur mobile seulement

Hello à tous Smiley smile

J'aurai besoin de votre aide svp Smiley biggrin

J'ai une image dans mon html (le css est intégré directement dans mon html) que je souhaite cacher seulement en mobile et non sur desktop.

voici ma balise d'image :


<img border="0" class="left autowidth" src="./images/photo1.png" style="text-decoration: none; -ms-interpolation-mode: bicubic; height: auto; border: 0; width: 100%; max-width: 96px; display: block;" width="96"/>


Que dois-je ajouter/modifier pour cela ? Merci d'avance Smiley ravi
Modérateur
Dedelskd a écrit :
le css est intégré directement dans mon html

Mais... mais... pourquoi ?! Smiley bawling
Il faudrait passer par les media queries mais il faut les mettre dans une feuille CSS... ou au moins une balise <style> dans le html mais pas possible dans la balise htm il me semble...

Sinon tu peux tenter de feinter avec les picture et source :
<picture>
   <source srcset="https://img.bfmtv.com/c/1256/708/bfm/1220779.jpg" media="(min-width: 600px)">
   <img src="" alt="">
</picture>

https://jsfiddle.net/undless/y6ke7n3q/
Meilleure solution
Modérateur
Dedelskd a écrit :
Top, ton astuce avec picture et source fonctionne à merveille ! Un grand merci à toi Laurent Smiley biggrin Smiley biggrin

Je sais pas si c'est très W3C friendly par contre Smiley sweatdrop ca doit laisser une img vide en plein milieu... ca fait un peu bricolage quoi c'est ptetre pas ouf mais bon si ca rempli le taff pour tes exigences Smiley ravi
Sujet clos
Aller à