Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: franculo_caoulene le le 27-10-2003 a 13:10:39

Titre: [CSS] impression
Posté par: franculo_caoulene le le 27-10-2003 a 13:10:39

Salut,

J'écume forums et sites mais je n'arrive pas à m'en sortir avec l'impression de ma page via css.
Je teste en vain différents codes mais seul le style du texte correspond à ce que je souhaite sur ma page imprimée. Ma feuille screen.css fonctionne plus ou moins il n'y a qu'une image de fond qui n'est pas dimensionnée.

Le but précis : générer en php des licences afin de les imprimer.

La mise en forme: une licence fait 5cm x 9cm, il y a 4 lignes contenant 3 licences en mode paysage (ce qui fait 12 licences par page papier). Les licences ont donc au total un gabarit de 20cm x 27cm par page papier.

1/ Je cherche à redéfinir les marges 5mm en haut et en bas 10mm à gauche et 17mm à droite et à imprimer en paysage.

Pour la mise en forme de mes licences j'ai utilisé les tables. Dans une boucle je génère n fois une table A contenant 3 <td> dans chaque <td> il y a une table B correspondant à la mise en page de la licence même. Sur une page papier, il y a donc 4 tables A contenant chacunes 3 tables B.

2/ Je cherche à ce que la table A (et implicitement la table B) ne soit pas coupée à l'impression.

3/ Je cherche à utiliser une image de fond dans la table B dimensionnée correctement.

Voici une tentative de code (sans les marges):

@media print {

.large{
font-family:Arial;
font-size:10pt;
font-weight:bold
}

.medium{
font-family:Arial;
font-size:10pt
}

.small{
font-family:Arial;
font-size:7pt;
font-weight:bold
}

table.x3{
width:27.0cm;
border-collapse:collapse;
border:none;
page-break-inside: avoid;
page-break-before: avoid
}

table.x1{
width:9.0cm;
border-collapse:collapse;
border:none;
background-image: url("fond_licence.jpg")
}

}


J'aimerais que vous m'aidiez à faire ce code. Comme je l'ai dit plus haut, j'ai déjà visité les sites. Si vous avez un lien vers un une feuille de style pour impression assez complète je suis aussi preneur.

Merci d'avance.

Franculo Caoulene.

PS: si j'ai utilisé les tables pour la mise en forme c'est parce que j'ai pu les dimensionner correctement. Je suis novice en css.

Titre: Re:[CSS] impression
Posté par: franculo_caoulene le le 27-10-2003 a 13:41:19

Merci pour ta réponse mais je ne vois rien qui se rapporte au @media print.
J'ai vu que IE6 apparemment a du mal à gérer l'impression en CSS2, je vais donc essayer avec un autre navigateur.
Ca fait qq jours que je cherche sur le web et malheureusement les forums sont pleins de liens vers d'autres sites mais manquent de codes concrets.
Aidez moi à faire la feuille de style ou bien donnez moi une feuille de style servant à l'impression qui fonctionne afin de comparer.

Merci.

Franculo Caoulene.

Titre: Re:[CSS] impression
Posté par: Chanchan le le 27-10-2003 a 15:18:51

Citation de: franculo_caoulene le le 27-10-2003 a 13:41:19
Merci pour ta réponse mais je ne vois rien qui se rapporte au @media print.
J'ai vu que IE6 apparemment a du mal à gérer l'impression en CSS2, je vais donc essayer avec un autre navigateur.
Ca fait qq jours que je cherche sur le web et malheureusement les forums sont pleins de liens vers d'autres sites mais manquent de codes concrets.
Aidez moi à faire la feuille de style ou bien donnez moi une feuille de style servant à l'impression qui fonctionne afin de comparer.

Merci.

Franculo Caoulene.


As-tu lu cet article là http://www.openweb.eu.org/articles/exemple_css_print/ ?

Il y a un lien, en bas de page, pour voir leur CSS pour l'impression...

Titre: Re:[CSS] impression
Posté par: franculo_caoulene le le 27-10-2003 a 16:02:25

oui bien sûr que j'ai vu leur feuille de style. Quand j'ai vu le lien je me suis dit "parfait!!!" mais quand je l'ai ouvert j'ai été un peu déçu car elle est très succincte. :(

C'est justement ça qui manque à mon goût dans les sites et forums des exemples de codes leplus complet possible.

Titre: Re:[CSS] impression
Posté par: Nissone le le 29-10-2003 a 10:52:01

Je ne sais pas s'il y a la réponse à ta question précisement, mais moi, j'ai souvent trouvé des choses intéressantes et bien expliquées pour mes CSS chez Alsacréations (http://www.alsacreations.com/articles/?PHPSESSID=362c83994cc268e75eebc062de98f119)

Bon courage. Tiens nous au courant !
Nissone

Titre: Re:[CSS] impression
Posté par: DJolhan le le 29-10-2003 a 13:12:54

Je vais te donner une petite explication rapide , peux etre qu'avec cela tu y arrivera sans probleme.
L'interet de faire un style en media print, et d'interdir l'affichage de certaines partie inutile de ton site, comme :
Le menu
Les pub etc etc.

lorsque tu as crés ton style.css tu lui a donné une certaines arborécense .
Décide quels sont les éléments a afficher et ceux a ne pas afficher.
dans ton media.css tu indiquera tout simplement les éléments que tu ne souhaite plus afficher.

Exemple :
Tu ne veux pas afficher ton div contenant du flash, ton top, tes pub et ton menu, et bien
tu rentre cela dans ton media.css

.flash,.top,.pub2,.menu {
display: none;
}

Ainsi lorsque tu feras un appércu avant impression, ton explorateur ira voir ce qu'il y a dans ton fichier media.css.

Au préalable il faut faire appel a tes deux feuilles de style pour que cela fonctionne bien entendu.

<style type="text/css">
<!--
@import url("style.css");
-->
</style>
<link href="media.css" rel="stylesheet" media="print" type="text/css" />

Deux methode ici sont utilisé, l'import et le lien. les deux methodes fonctionnent correctement entre elles

Titre: Re:[CSS] impression
Posté par: franculo_caoulene le le 29-10-2003 a 15:25:54

Alors pour vous tenir au courant ;)
J'ai changé de méthode (j'aurais tout essayé). J'utilise aussi le PHP dans le site et j'ai donc décidé d'imprimer via un pdf généré par fpdf (gratuit) www.fpdf.org (http://www.fpdf.org).

J'ai bien compris l'intérêt du @media print mais on a la possibilité d'imprimer en paysage et rien que ça je n'ai pas réussi :(. Et pourtant ça peut être très utile pour les sites.

merci pour vos réponses.

Franculo Caoulene.


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.