60 votes

Comment imprimer avec la feuille de style de l'écran ?

Un certain nombre de sites web que j'utilise ont des feuilles de style vraiment mauvaises pour les médias imprimés, mais leurs feuilles de style à l'écran sont très bonnes.

Existe-t-il un moyen de dire à mon navigateur d'ignorer la feuille de style d'impression et d'imprimer uniquement avec la feuille de style d'écran ?

J'aimerais aussi le faire lorsque je veux montrer aux clients la différence entre les deux.

23voto

Can Gencer Points 171

Utilisation des outils de développement de Chrome ( Ctrl + Shift + I ) est la seule chose que j'ai trouvée qui fonctionne.

  1. Recherche de toutes les instances de media="screen" et supprimer cet attribut.
  2. Ensuite, cherchez media="print" et supprimer tout le lien.
  3. Essayez ensuite d'imprimer.

Cela me donne généralement la page avec le style de l'écran.

Si vous voulez vraiment désactiver les styles d'impression, vous pouvez installer l'extension Web Developer (je pense qu'il existe une version pour Firefox et Chrome). Elle comporte un bouton permettant de désactiver les styles d'impression. Cependant, elle n'étend pas le style "écran" à l'impression, donc la plupart du temps, cela ne fonctionne pas comme vous l'espérez.

19voto

dj rock Points 299

I J'ai trouvé un moyen facile de le faire en Chrome .

Ouvrez l'outil de développement > Rendu > Sélectionnez "écran" dans Emuler le média CSS.

Essayez maintenant d'imprimer. Il choisira le CSS de l'écran au lieu de celui de l'impression.

18voto

Leo Gallucci Points 323

Veuillez plutôt consulter la réponse de Bastian : https://superuser.com/a/1064165/201530

16voto

kitchin Points 271

Il existe une nouvelle méthode permettant de choisir directement l'émulation du support dans les outils de développement, cf. https://stackoverflow.com/questions/9540990/using-chromes-element-inspector-in-print-preview-mode/

6voto

Leo avait un bonne idée il y a, mais il ne fait pas tout à fait ce que James a dit : il devrait être

$('*[media="screen"]').attr('media', '');$('*[media="print"]').remove();

Conseil : enregistrez ce qui suit sous forme de marque-page pour en faciliter l'utilisation :

javascript:var%20el=document.createElement('script');el.type="text/javascript";el.src="http://code.jquery.com/jquery-latest.pack.js";document.body.appendChild(el);setTimeout(function(){$('*[media="screen"]').attr('media','');$('*[media="print"]').remove();},%202000)

Cela précharge jQuery et attend 2 secondes pour qu'il se termine, mais si cette attente n'est pas suffisante, il suffit de l'exécuter à nouveau, jQuery devrait avoir été chargé entre-temps.

SistemesEz.com

SystemesEZ est une communauté de sysadmins où vous pouvez résoudre vos problèmes et vos doutes. Vous pouvez consulter les questions des autres sysadmins, poser vos propres questions ou résoudre celles des autres.

Powered by:

X