28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je souhaite créer une feuille de style CSS pour permettre l'impression de recettes de cuisine mais j'avoue que j'ai du mal à jongler entre CSS et Javascript (utilisé pour lancer l'impression).

Est-ce que dans mon fichier print.css je peux faire en sorte de ne pas imprimer le bouton d'impression ?

Est-ce que je peux ajouter une ligne en pied da page avec le nim du site ?

Lorsque j'imprime en haut j'ai &w&bPage et en bas &u& ... D'où ça vient?? Smiley sweatdrop

Merci par avance pour votre aide Smiley confused
Modifié par PourMincir (01 Jun 2006 - 12:10)
Bonjour,

M'étant penché sur la question récemment, je fais te faire profiter de ma petite expérience.

Déjà, le lien javascript pour lancer l'impression est tout bête :
<a href="javascript:self.print()">Blablabla</a>


Ensuite, il te faut préciser dans ton head qu'il faut utilisé la feuille de style pour l'impression :
<link href="print.css" rel="stylesheet" type="text/css" media="print" />


Pour finir, il ne te reste plus qu'à faire ta feuille de style print.css de sorte que n'apparaissent que les éléments qui t'intéressent en usant et abusant de l'option :
display: none;


Un conseil : n'hésites pas à tester ton site en te servant de ta feuille de style print comme feuille de style de base. Le truc, pour vraiment lui donner l'apparance qu'elle en auras à l'impression, c'est de copier/coller tout en haut de ta feuille print.css l'intégralité de ta feuille de style standard (que tu pourras virer par la suite). Ce petit détail tout bête m'a fait perdre une bonne demi-journée, car je n'avais pas pris en compte que la feuille print.css ne fait que modifier la feuille de base, ne la remplacant pas !
Salut !

Concernant ta première question qui est de savoir si tu peux ne pas l'imprimer... La réponse est la suivante : oui, bein sûr ! Smiley lol

Il te suffit d'affecter une class à ton bouton et de spécifier que tu ne veux pas imprimer cette class. Cela te donnera quelque chose comme ça :
CSS :
.noprint{ display: none; }

HTML : 
<a class="noprint">texte du lien</a>

Pour le reste, je ne peux que te conseiller d'aller jeter un oeil sur le site d'openweb qui te détaille tout ce qu'il faut savoir pour faire une feuille de style d'impression.
Smiley ravi

<Edit> Encore grillée...</Edit>
Modifié par Cygnus (30 May 2006 - 16:12)
Parfait pour ne pas imprimer le logo de l'imprimante Smiley ravi , par contre savez vous pour imprimer quelque chose en plus ? (je veux ajouter le nom du site en bas lors de l'impression)
Et quelqu'un peut il m'aider pour enlever les inscriptions en haut et bas de la page ?

Merci Smiley langue
Pour imprimer quelque chose en plus, ma foi c'est assez simple dans l'esprit : Tu créés un conteneur qui sera en display: none; dans ta feuille de style standard et en display: inline; dans ta print.css.

Par contre, pour les truc en haut et en bas, j'n'ai pas trouvé (faut dire que j'n'avais pas cherché ^^)
Parfait tout ça !!!
J'ai ajouté ma tite ligne et puis pour les inscriptions en haut... ben euh lorsque la fiche est en ligne ça imprime le numéro de la page... c'est parce que je faisais le test sur une page non en ligne... no comment lol Smiley langue

Merci pour votre aide Smiley jap