CSS (feuilles de style en cascade) vous donne un contrôle considérable sur la façon dont le contenu de vos pages Web est affiché à l'écran. Ce contrôle s'étend également aux autres supports, par exemple lorsque la page Web est imprimée.
Vous vous demandez peut-être pourquoi vous souhaitez ajouter un fonction d'impression à votre page Web; après tout, la plupart des gens savent déjà ou peuvent facilement comprendre comment imprimer une page Web à l'aide des menus de leur navigateur.
Mais il existe des situations où l'ajout d'un bouton d'impression ou lien à une page non seulement rendra le processus plus facile pour vos utilisateurs lorsqu'ils ont besoin d'imprimer une page mais, peut-être encore plus important, vous donne plus de contrôle sur la façon dont ces impressions apparaîtront sur papier.
Voici comment ajouter des boutons d'impression ou des liens d'impression sur vos pages, et comment définir quels éléments du contenu de votre page seront imprimés et lesquels ne le seront pas.
Ajout d'un bouton d'impression
Vous pouvez facilement ajouter un bouton d'impression à votre page Web en ajoutant le code suivant à votre document HTML à l'endroit où vous souhaitez que le bouton apparaisse:
onclick = "window.print (); return false;" />
Le bouton sera étiqueté comme Imprimer cette page quand il apparaît sur la page Web. Vous pouvez personnaliser ce texte à votre guise en changeant le texte entre les guillemets suivants
valeur =dans le code ci-dessus.
Notez qu'il y a un seul espace vide précédant le texte et le suivant; cela améliore l'apparence du bouton en insérant un espace entre les extrémités du texte et les bords du bouton affiché.
Ajout d'un lien d'impression
Il est encore plus facile d'ajouter un simple lien d'impression à votre page Web. Insérez simplement le code suivant dans votre document HTML où vous souhaitez que le lien apparaisse:
impression
Vous pouvez personnaliser le texte du lien en remplaçant «imprimer» par ce que vous choisissez.
Rendre des sections spécifiques imprimables
Vous pouvez configurer la possibilité pour les utilisateurs d'imprimer des parties spécifiques de votre page Web à l'aide d'un bouton ou d'un lien d'impression. Vous pouvez le faire en ajoutant un print.css fichier à votre site, en l'appelant dans la tête de votre document HTML, puis en définissant les sections que vous souhaitez rendre facilement imprimables en définissant une classe.
Tout d'abord, ajoutez le code suivant à la section d'en-tête de votre document HTML:
type = "text / css" media = "print" />
Ensuite, créez un fichier nommé print.css. Dans ce fichier, ajoutez le code suivant:
corps {visibilité: caché;}
.print {visibilité: visible;}Ce code définit tous les éléments du corps comme masqués lors de l'impression, sauf si la classe "print" lui est affectée.
Maintenant, tout ce que vous avez à faire est d'assigner la classe "print" aux éléments de votre page Web que vous souhaitez imprimer. Par exemple, pour rendre une section définie dans un élément div imprimable, vous utiliseriez
Tout autre élément de la page qui n'est pas affecté à cette classe ne sera pas imprimé.