!

Le pauvre vieux! Une déclaration importante reçoit beaucoup de flak dans la communauté CSS et pour raison. Il est inutile, crée un cauchemar de maintenance et se moque de la cascade creux. Je n'ai pas pensé à utiliser! Important depuis des années, jusqu'à ce que j'en découvre une très bonne utilisation: feuilles de style imprimé.

prétendons que nous voulons créer une galerie d'images. Fais de notre mieux pour honorer les idéaux de l'amélioration progressive, nous nous assurons d'abord que les images sont contenues dans une liste HTML. Finalement, nous voulons utiliser JavaScript pour créer un effet de diaporama fondu / fondu-out, mais notre base est une seule colonne d'images. Si un visiteur a des handicapés JavaScript, c'est ce qu'il verra.

D'accord, jusqu'ici tout va bien. Cependant, lorsque nous venons une feuille de style imprimé, nous découvrirons un défaut dans notre plan: lorsque vous utilisez JavaScript pour animer les éléments HTML, vous finissez inévitablement par modifier l'attribut de style des éléments. Dans notre diaporama, JavaScript a modifié la position et l'opacité des images, donc une seule est révélée à la fois. Lorsque nous allons imprimer la page de la galerie, bien que nous voulons une seule colonne d'images, ce que nous finissons par l'impression n'est qu'une seule image. C'est parce que vous n'êtes pas en mesure de spécifier un type de support cible pour CSS déclaré dans l'attribut de style d'un élément; Vous ne pouvez pas dire que tous les styles déclarés dans l'attribut de style sont pour l'écran uniquement.

Donc, ce dont vous avez besoin est un moyen de spécifier les styles d'impression qui peuvent remplacer les styles en ligne. Il n'y a qu'une seule façon de le faire :! IMPORTANT. Dans votre feuille de style imprimé, réinitialisez la position et l'opacité des éléments d'image et ajoutez! IMPORTANT:

img.gallery {
  position: static !important;
  opacity: 1 !important;
}

C'est vraiment ça; J'ai trouvé une utilisation légitime pour! Importante et je voulais la partager.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!