Une feuille de style pour les ordinateurs de poche peut-elle sauter le chargement des images?

Question

J'ai une feuille de style pour les ordinateurs de bureau, et une autre pour les ordinateurs de poche. La page Web affiche certaines images lorsqu'elles sont affichées sur le bureau, mais masque ces images lorsqu'elles sont affichées sur des ordinateurs de poche. La page apparaît comme conçue pour les ordinateurs de bureau et les ordinateurs de poche.

Lorsque je vérifie les journaux du serveur, je constate que le terminal est en train de charger les images, mais ne les affiche pas. Existe-t-il un moyen d'empêcher le terminal de charger entièrement les images, puisqu'il n'en a pas besoin, sans avoir à gérer deux ensembles de pages Web? Peut-il être fait en utilisant seulement des feuilles de style?

Merci d'avance.

Ray Mond

Answer 1

Inclure les images que vous ne souhaitez pas afficher sur les appareils mobiles comme l'image d'arrière-plan. Dans la feuille de style du navigateur, vous pouvez alors utiliser

.element { 
    background: #FFF url('image.png') no-repeat left top; /* or whatever */ 
} 

alors que dans la feuille de style de poche que vous venez de ne pas définir une image d'arrière-plan, donc, selon l'utilisation exacte, vous pouvez utiliser

.element { 
    display: none; 
} 

ou

.element { 
    background: #FFF; 
} 

Cependant, il ne sera pas possible de supprimer les images que vous joindre à <img src="" /> ensuite par des règles CSS (juste display: none etc, mais qui ne st op eux de chargement, comme vous avez remarqué).

Answer 2

Envoyer votre feuille de style par tête HTTP avant le balisage:

Link: <compact.css>; rel="stylesheet"; media="handheld" 

Ensuite, le plus utilisé navigateur de poche - Opera - ne se charge pas les images. WebKit (Safari) fait encore, cependant - même des images de fond pour les éléments cachés!