Comment faire une mise en page pour l’impression ?

Comment faire une mise en page pour l’impression ?

Créez un fichier CSS dédié à l’impression

<link rel="stylesheet" type="text/css" href="fichier-impression.css" media="print" />

<!-- Explication: l'attribut "media" définit sur la valeur "print" indique
à votre navigateur d'utiliser ce fichier pour gérer le design de l'impression -->

Si vous utilisez cette technique, veuillez préciser l’attribut « media » de votre fichier classique sur « screen », afin que votre navigateur différencie bien les deux. Vous éviterez de nombreuses erreurs!

Ce qui nous donne:

<link rel="stylesheet" type="text/css" href="fichier-ecran.css" media="screen" />
<link rel="stylesheet" type="text/css" href="fichier-impression.css" media="print" />

Définissez une zone « print » dans votre fichier classique

@media print{
	/* Ecrivez votre code CSS ici */
}

Cette technique est plus simple à mettre en oeuvre car vous ne devez pas modifier votre HTML. Vérifiez cependant que votre lien vers votre fichier CSS ne contient pas d’attribut « media ».

Ce qui nous donne:

<link rel="stylesheet" type="text/css" href="fichier-combine.css" />

CSS, css mise en page impression, débutant, faire une mise en page pour l’impression

A propos de MarieEve Louvel

Depuis 3 ans, je partage mes connaissances sur ce blog, pour les entrepreneurs désireux de créer leur site vitrine et/ou leur blog professionnel avec WordPress. Mon expérience professionnelle va de l'accompagnement à la formation, en passant par de la création de site ou de logiciel. Retrouvez mes cours en ligne sur mon site FeelWeb Formation [http://feelwebformation.com]

Trackbacks/Pingbacks

  1. Le monde merveilleux du bloging - Les Doigts dans le Net - [...] imprimer en css [...]

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

This Blog will give regular Commentators DoFollow Status. Implemented from IT Blögg

EmailEmail
PrintPrint