nicht angemeldet
NUR einen div-Tag Ausdrucken....
Hallo Forengemeinde,
ich suche nach einer Möglichkeit, die Druckausgabe einer Html-Seite zu optimieren. Ich bin schon soweit, dass ich über zweit Style-Sheets die Druckausgabe trenne (<style type="text/css" media="print"> und <style type="text/css" media="screen,projection">). Allerdings möchte ich nicht ALLE Style-Klassen, die ich NICHT drucken möchte ausblenden:
.Inhalt {
visibility: hidden;
display: none;
}
sondern ich möchte den UMGEKEHRTEN Weg gehen! Ich möchte NUR einen Layer (div-TAG),den mit dem Text, ausdrucken... gibts da eine Möglichkeit??
Danke für Eure Hilfe
-
Ich möchte NUR einen Layer (div-TAG),den mit dem Text, ausdrucken... gibts da eine Möglichkeit??
Hallo Dreamkugel,
Du kannst um den zu druckenden Bereich ein div legen (z.B. <div id="printcontent">) und Dir dann per getElementById den Inhalt auf der Druckseite anzeigen lassen.
Gruß
Deejay-
Hi,
Ich möchte NUR einen Layer (div-TAG),den mit dem Text, ausdrucken... gibts da eine Möglichkeit??
Du kannst um den zu druckenden Bereich ein div legen (z.B. <div id="printcontent">)
Wozu? ein DIV ist doch bereits vorhanden?
und Dir dann per getElementById den Inhalt auf der Druckseite anzeigen lassen.
Unsinn. Dass hat nichts mehr mit CSS zu tun und mit der medienabhängigen Formatierung _einer_ HTML-Seite.
Das geht nur dann, wenn das zu druckende Element nicht verschachtelt ist: über body * {display:none;} werden alle Elemente ausgeblendet und das zu druckende DIV danach wieder auf display:block gesetzt. Außerdem müßten alle innerhalb dieses DIVs befindlichen Elemente wieder eingeblendet werden, was aber ebenfalls mit * möglch ist.
freundliche Grüße
Ingo-
hi,
über body * {display:none;} werden alle Elemente ausgeblendet und das zu druckende DIV danach wieder auf display:block gesetzt. Außerdem müßten alle innerhalb dieses DIVs befindlichen Elemente wieder eingeblendet werden, was aber ebenfalls mit * möglch ist.
könnte man deren display nicht von vorherein auf inherit setzen, so dass sie dann trotz
body * {display:none;}
ihren wert für display von ihrem vorfahrenelement, dem div, erben?
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
Langsam verwirrt mich die Sache... ich hab nebenher mal etwas rumprobiert, aber iss alles nich so doll... ich krieg den <div> nicht wieder eingeblendet :-( Hat jemand etwas "Beispiel-Code"?
-
Hi,
ich krieg den <div> nicht wieder eingeblendet :-( Hat jemand etwas "Beispiel-Code"?
hast Du meine Anmerkung:
Das geht nur dann, wenn das zu druckende Element nicht verschachtelt ist
berücksichtigt?
freundliche Grüße
Ingo -
Hallo,
Langsam verwirrt mich die Sache... ich hab nebenher mal etwas rumprobiert, aber iss alles nich so doll... ich krieg den <div> nicht wieder eingeblendet :-( Hat jemand etwas "Beispiel-Code"?
Probiere es mal so:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test by TM 01/05</title>
<style type="text/css" media="print">
<!--body * {display: none;}
body div#drucken, div#drucken * {display: block;}-->
</style>
</head>
<body>
<p>Inhalt 1</p>
<div id="drucken"><p>Inhalt 2</p></div>
</body>
</html>MfG, Thomas
-
Hallo,
Langsam verwirrt mich die Sache... ich hab nebenher mal etwas rumprobiert, aber iss alles nich so doll... ich krieg den <div> nicht wieder eingeblendet :-( Hat jemand etwas "Beispiel-Code"?
Probiere es mal so:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test by TM 01/05</title>
<style type="text/css" media="print">
<!--body * {display: none;}
body div#drucken, div#drucken * {display: block;}-->
</style>
</head>
<body>
<p>Inhalt 1</p>
<div id="drucken"><p>Inhalt 2</p></div>
</body>
</html>MfG, Thomas
Danke, das klappt :-) der <div id="drucken"> ist wieder DA!! Juhu NUR: der er sollte schon links oben auf der Druck-Seite stehen... jetzt werden ja nur die restlichen Elemente einfach weggelassen... der Platz, an dem Header und Menü waren, bleibt einfach leer...
-
hi,
bitte auf die sinnfreien fullquotes verzichten, danke. (</faq/#Q-09a>, </faq/#Q-09b>)
Danke, das klappt :-) der <div id="drucken"> ist wieder DA!! Juhu NUR: der er sollte schon links oben auf der Druck-Seite stehen... jetzt werden ja nur die restlichen Elemente einfach weggelassen... der Platz, an dem Header und Menü waren, bleibt einfach leer...
da du sie per display:none ausgeblendet hast, wird für sie kein platz mehr reserviert - daher kann es als nicht kommen.
ist denn der zu druckende bereich noch irgendwie positioniert ...?
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
da du sie per display:none ausgeblendet hast, wird für sie kein platz mehr reserviert - daher kann es als nicht kommen.
ist denn der zu druckende bereich noch irgendwie positioniert ...?
Nein, keinerlei Positionierungen....
Ich habe das Problem etwas unkonventionell gelöst...
<!--print.css://-->
body * {display: none;}
body div#content, div#content * {
display: block;
padding-top: 20px;
padding-left: 20px;
}<!--screen.css://-->
#oben {
font-family: Arial, "MS Sans Serif", Verdana;
font-size: 12px;
color: #990033;
background-color: #006633;
visibility: visible;}
#links {
font-family: Arial, "MS Sans Serif", Verdana;
font-size: 12px;
color: #0033CC;
visibility: visible;
background-color: #9900CC;
}#content {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0000CC;
background-color: #FFFFCC;
padding-top: 170px;
padding-left: 170px;
}die Ebenen "oben" und "links" liegen jetzt über der Inhaltsebene und decken bei der Bildschirmanzeige 150px von "content" ab... In der Druckvorschau ist der Rand dann nur noch 20 px....
Ich konnte aber noch nicht mit anderen Browsern als IE6 testen... Ich fürchte, da gibts Probleme, oder???
-
hi,
ist denn der zu druckende bereich noch irgendwie positioniert ...?
Nein, keinerlei Positionierungen....
na ja, mit
#content { ...
padding-top: 170px;
padding-left: 170px;läuft's doch aber fast auf das gleiche hinaus, oder?
sollte zumindest von vornherein logisch sein, dass das auch beim drucken entsprechenden freiraum produziert.
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
na ja, mit
#content { ...
padding-top: 170px;
padding-left: 170px;läuft's doch aber fast auf das gleiche hinaus, oder?
sollte zumindest von vornherein logisch sein, dass das auch beim drucken entsprechenden freiraum produziert.
DAS habe ich aber erst ANSCHLIESSEND einbefügt, damit die linke Ebene nicht den Text überdeckt. Das gilt ja auch NUR für Screen...
bei "print" passt das ja jetzt. Ausserdem gehts mir um den Abstand der EBENE zum Druckrand, nicht um den Abstand des Textes zum Ebenenrand...
-
-
-
-
-
-
-
Hi,
könnte man deren display nicht von vorherein auf inherit setzen, so dass sie dann trotz
body * {display:none;}
ihren wert für display von ihrem vorfahrenelement, dem div, erben?Damit aus inline-Elementen und table-Elementen und ... lauter block-level-Elemente werden?
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
hi,
Damit aus inline-Elementen und table-Elementen und ... lauter block-level-Elemente werden?
könnte doch interessant aussehen, hm?
OK, war wieder mal zu kurz gedacht ...
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."
-
-
-
-