HTML - wie definieren das bestimmte Sachen nicht mit gedruckt werden?

Shader · 29.06.2006

Nun ich hab jetzt ua. ein paar Buttons in einer Website eingebaut, was mich daran stört ist das die Buttons mit gedruckt werden - das will ich nicht. Ich hab mich zwar im Web mal schlau gemacht aber da ich noch lange nicht ein HTML Profi bin sondern immer noch ein Beginner hat mir das Web nicht geholfen, jetzt hoffe ich ihr könnt mir gut erklärend helfen wie ich das denn machen kann das die Buttons wie

Code:

<input type="button" value="Formular Drucken" onclick="javascript:window.print()" />

nicht mit gedruckt werden?

wario · 29.06.2006

das geht in etwa so:

du brauchst zwei Style Sheets Dateien, eine für den Bildschirm einen für den Drucker.
In beiden Style-Dateien definierst du jeweilige Style-Classe einfach anders.

inhalt screen.css:
...
.noprint { font-family: Arial; color: black; font-size: 12px; ... }
...

inhalt print.css:
...
.noprint { display:inline; visibility:hidden; }
...

In deine HTML Datei bindest du im <Head> Bereich beide Style Sheet Dateien ein:
...
<link rel="stylesheet" media="screen" href="screen.css" type="text/css">
<link rel="stylesheet" media="print, embossed" href="print.css" type="text/css">
...
...
<div id="noprint" class="noprint">
Ich bin das Element, das nur am Bildschirm zu sehen, und nicht ausgedruckt wird

</div>

Nun musst du einfach deinem "Element" die Class "noprint" zuweisen.
Dann sollte es gehen. Im InternetExplorer kannst du es testen indem du auf Datei > Druckvorschau gehst, da wird das Element dann nicht angezeigt.

Oder so:

Shader · 29.06.2006

Also ich hab jetzt die screen.css und print.css angelegt.
Für den Button hab ich stehen:

Code:

<div id="noprint" class="noprint"><input type="button" value="Formular Drucken" onclick="javascript:window.print()" /></div>

Er wird aber noch immer angezeigt. :confused:

In der print.css steht folgendes: .noprint { display:inline; visibility:hidden; }
Was muss oder kann denn überhaupt in der screen.css und print.css drin stehen?
Und worauf muss ich beides anwenden?
Also je nach dem was angezeigt werden soll und was gedruckt werden soll auf alles oder nur auf eines oder wie?

Ich hab leider mit den stylesheets und css2 noch so meine Probleme. :rolleyes:

Aber schon mal vielen dank für deine schnelle Antwort.

wario · 29.06.2006

Na dann musst du dich wohl oder übel in die Welt der Stylesheets einlesen...
z.B. hier : http://de.selfhtml.org/css/intro.htm und http://de.selfhtml.org/css/formate/einbinden.htm#link_media

Kurz:
mit Style Sheets lagerst du die formatierung/darstellung deiner HTML Inhalte in eine extra Datei aus, um dadurch einfach, an nur einer stelle, das Aussehen der gesamten Homepage zu ändern.
In CSS Dateien legt man größe, farbe, art, position von sämtlichen Elementen wie Schriften, Tabellen, Button, Links, etc. pp. fest und bindet dann die CSS datei in jede HTML Seite ein. Um nun z.B. einen Button einheitlich auf der ganzen Homepage zu gestalten/zu ändern musst du nur noch die CSS Datei anpassen, und nicht jede HTML Seite einzeln. Man legt je nach ausgabe Typ verschiedene CSS Formate fest, um die Seite dadurch an Medien wie Screen, Prints oder auch Handheld sanzupassen.

In deiner Html Seite musst du in den Head Bereich die Stylesheets einbinden. z.B.:

Code:

<html>
<head>
<title>Titel der Datei</title>
<link rel="stylesheet" media="screen" href="screen.css">
<link rel="stylesheet" media="print, embossed" href="print.css">
</head>
<body>
<input type="button" value="Formular Drucken" onclick="javascript:window.print()" class="noprint" />
</body>
</html>

Shader · 29.06.2006

Gut alles klar, dann les ich mich da mal rein.

Suche

HTML - wie definieren das bestimmte Sachen nicht mit gedruckt werden?

Shader

Semiprofi

wario

Neuling

Shader

Semiprofi

wario

Neuling

Anhänge

Shader

Semiprofi

Ähnliche Themen