Page 1 sur 1
Version imprimable avec CSS
Publié : 14 nov. 2006, 22:20
par EmmaZL
Bonjour,
Sur mon site, pour chaque page, j'aimerais pouvoir avoir une version imprimable, si possible avec CSS. J'ai bien lu cet article
http://pompage.net/pompe/impression/ mais y a un truc que je ne comprend pas.
Dans mon code, j'aurai ceci :
Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css">
<LINK rel="stylesheet" type"text/css" href="print.css" media="print">
Où style.css est la feuille de style pour la page normale et print.css est la feuille de style pour la page imprimable.
Bon, ce que je ne comprends pas, c'est comment faire le lien vers la page imprimable. En haut de chaque article, j'aurai un petit dessin d'imprimante et un lien "Version imprimable" du style :
Code : Tout sélectionner
<a href="blabla.htm" target="_blank" class="texte">Version imprimable</a>
Je dois mettre quoi à la place de blabla.htm ?
Merci d'avance.
Emma.
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.8) Gecko/20061025 Firefox/1.5.0.8
Publié : 14 nov. 2006, 22:42
par Flore
En fait tu n'as rien de plus à faire une fois que tu as défini la css pour imprimer. Quand l'utilisateur imprimera la page, cela sélectionnera automatiquement la feuille de style d'impression.
Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.1) Gecko/20061010 Firefox/2.0
Publié : 14 nov. 2006, 22:51
par EmmaZL
Ah ok je vois. Merci pour ta réponse.
C'est le media="print" qui gère ça je pense (si j'ai bien compris).
Cependant, n'est il tout de même pas possible d'avoir un lien "Version imprimable" qui renvoie vers la même page mais cette dernière utiliserait une autre CSS ?
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.8) Gecko/20061025 Firefox/1.5.0.8
Publié : 15 nov. 2006, 07:49
par Benoit
Ben en fait il suffit de demander un aperçu avant impression pour ça
Mais sinon oui ça doit être possible de faire un petit script qui charge la feuille de style "print".
Re: Version imprimable avec CSS
Publié : 15 nov. 2006, 09:07
par calimo
EmmaZL a écrit :Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css">
<LINK rel="stylesheet" type"text/css" href="print.css" media="print">
Où style.css est la feuille de style pour la page normale et print.css est la feuille de style pour la page imprimable.
En fait, comme tu ne définis pas de média pour style.css, elle sera appliquée à tous les médias, écran, impression, vocal,
Pour que style.css ne soit appliquée que pour l'écran, il faudrait définir son media.
Simplement, lorsque le media change, donc devient "impression", tu as une feuille de style en plus.
Ce serait peut-être plus simple à comprendre si tu mettais le media pour style.css à "screen", tu comprendrais que la page, quand elle est affichée sur l'écran, utilise le media "screen", et lorsque tu l'affiches sur une feuille de papier, ce n'est plus un écran, mais un "print". Est-ce que c'est plus clair comme ça ?
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.8) Gecko/20061025 Firefox/1.5.0.8
Re: Version imprimable avec CSS
Publié : 15 nov. 2006, 21:39
par EmmaZL
calimo a écrit :EmmaZL a écrit :Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css">
<LINK rel="stylesheet" type"text/css" href="print.css" media="print">
Où style.css est la feuille de style pour la page normale et print.css est la feuille de style pour la page imprimable.
En fait, comme tu ne définis pas de média pour style.css, elle sera appliquée à tous les médias, écran, impression, vocal,
Pour que style.css ne soit appliquée que pour l'écran, il faudrait définir son media.
Simplement, lorsque le media change, donc devient "impression", tu as une feuille de style en plus.
Ce serait peut-être plus simple à comprendre si tu mettais le media pour style.css à "screen", tu comprendrais que la page, quand elle est affichée sur l'écran, utilise le media "screen", et lorsque tu l'affiches sur une feuille de papier, ce n'est plus un écran, mais un "print". Est-ce que c'est plus clair comme ça ?
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.8) Gecko/20061025 Firefox/1.5.0.8
Donc comme ça, juste ?
Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css" media="screen">
<LINK rel="stylesheet" type"text/css" href="print.css" media="print">
Re: Version imprimable avec CSS
Publié : 15 nov. 2006, 23:43
par nico@nc
EmmaZL a écrit :Donc comme ça, juste ?
Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css" media="screen">
<LINK rel="stylesheet" type"text/css" href="print.css" media="print">
Juste, mais plus clair comme ça :
Code : Tout sélectionner
<link href="style.css" rel="stylesheet" type="text/css" media="screen">
<link href="print.css" rel="stylesheet" type"text/css" media="print">
Mais ainsi, note que s'il n'y a ni d'écran, ni d'imprimante, aucune feuille de style ne sera utilisée... (c'est possible ça ?)
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1) Gecko/20061010 Firefox/2.0
Re: Version imprimable avec CSS
Publié : 16 nov. 2006, 08:39
par calimo
nico@nc a écrit :Mais ainsi, note que s'il n'y a ni d'écran, ni d'imprimante, aucune feuille de style ne sera utilisée... (c'est possible ça ?)
Ben oui, plutôt :
http://www.yoyodesign.org/doc/w3c/css2/ ... edia-types
Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.8) Gecko/20061025 Firefox/1.5.0.8