Mit CSS die Druckeigenschaften ändern

[BeachBoy]

Hallo,

ich möchte mir einen Link schreiben, womit ich die komplette Seite drucken kann. Dabei möchte ich auch Hintergrundbilder mitdrucken. Gibt es dafür einen passenden CSS-Code, der den Hintergrund mitdruckt? Wenn ja, wie heißt dieser? Brauche dieses, damit die Seite beim Drucken genau so aussieht wie im Browser.

MfG,
Sebastian

 

[hpvw]

Ob der User Hintergrundfarben und Bilder druckt ist ausschließlich Sache seiner Einstellungen im Browser. Du kannst jedoch ein passendes Stylesheet für die Druckausgabe in der HTML-Datei angeben, was meist wesentlich sinnvoller ist, da der Bidschirm und das Papier zwei völlig verschiedene Medien sind.

Gruß hpvw

 

[BeachBoy]

doofe Frage, aber wie würde so ein Stylesheet für die Druckausgabe in der HTML-Datei aussehen?
Bitte um genau Hilfe.

MfG,
Sebastian

 

[hpvw]

Du verwendest ganz normale CSS-Eigenschaften für Schrift, Abstände und sonstiges. Auf Hintergründe solltest Du Dich natürlich nicht verlassen. Es gibt auch ein paar spezielle Eigenschaften für Printmedien. In wie weit die von den Browsern tatsächlich unterstützt werden, habe ich jedoch noch nicht ausprobiert.

Das Stylesheet für das Drucklayout bindest Du dann nur für das entsprechende Ausgabemedium ein.

Gruß hpvw

 

[BeachBoy]

Danke, werd ich mal ausprobieren und mich gegebenenfalls nochmal wegen Fragen melden, wenn ich wo nicht weiter weiss.

MfG,
Sebastian

 

[BeachBoy]

hi,

ich habe es gerade mal ausprobiert und mit den verschiedenen Dateien für die verschiedenen Ausgabemedien geht es auch, allerdings macht der Drucker die Schrift an einer bestimmten Stelle nicht weiß, obwohl im css-Code die Farbe auf weiß gestellt wurde. Wie bringe ich dem Drucker bei, dass er den Text auch weiß druckt, also welcher Quellcode muss in die css-Datei? Kann mir jemand den genauen Quellcode sagen, komme mit den Angaben von selfhtml nicht ganz klar.

Quellcode aus der html-Datei:

<div id="name">Hier der Text der weiß gedruckt werden soll!</div>

und die css-Datei:

#name
{
position:relative;
color:#ffffff;
width:100%;
top:40px;
left:0px;
font-weight:bold;
font-size:12px;
text-align:center;
z-index:5;
}

Danke schonmal im vorraus.

MfG,
Sebastian

 

[Maik]

Probier's mal mit folgendem Stylesheet:

@media print {

#name
{
position:relative;
color:#ffffff;
width:100%;
top:40px;
left:0px;
font-weight:bold;
font-size:12px;
text-align:center;
z-index:5;
}
}

 

[BeachBoy]

ich würde ja gerne sagen, dass es funktioniert, und es sieht auch logisch aus, aber er druckt den Text wieder in schwarz, und nicht in weiß, wie im Stylesheet geschriebe. Das kann doch nicht so schwer sein. Kann mir vielleicht jemand sicher sagen, wie es funktioniert? Wäre echt ne große Hilfe, bin nämlich echt am verzweifeln
Habe hinter diesem Text ein Bild liegen, das dunkelblau ist, deswegen das gaze.

Kann mir vielleicht gleichzeitig jemand sagen, wie ich dem Drucker mit css sagen kann, dass er Querformat drucken soll, damit der User nicht selber auf Querformat umstellen muss.

MfG,
Sebastian

 

[Sven Mintel]

Dass er die Farbe ignoriert, scheint am Drucker zu liegen... bei mir druckt er die weisse Schrift :suspekt: nur, wenn man einstellt, dass er Hintergrundfarbe/Bilder drucken soll.
Da stellt sich die Frage, ...wenn das bei dir ähnlich ist:
Du hast keinen Hintergrund:==weiss
Weisse Schrift:==weiss
...verstehst du, worauf ich hinaus will?

Wenn du nicht willst, dass etwas gedruckt wird, kannst du es per visibility/display "ausblenden"

 

[Gumbo]

Mit welchem Browser probierst du das Ganze? Vielleicht unterstützt er dies gar nicht.