Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Kann ich Druckränder für HTML-Seiten mithilfe von CSS festlegen?

DDD
Freigeben: 2024-11-09 01:24:02
Original
657 Leute haben es durchsucht

Can I Set Print Margins for HTML Pages Using CSS?

Ränder beim Drucken von HTML-Seiten festlegen

Beim Drucken von HTML-Seiten müssen Sie möglicherweise den linken und rechten Rand anpassen, um sicherzustellen, dass der Ausdruck konform ist auf die von Ihrem Drucker definierten Ränder.

Ist es möglich, Druckränder in einem CSS-Stylesheet festzulegen?

Ja, Sie können Seitenränder in cm oder mm festlegen Einheiten in Ihrem CSS-Stylesheet. Zum Beispiel:

<code class="css">body {
  margin: 25mm 25mm 25mm 25mm;
}</code>
Nach dem Login kopieren

Die Verwendung von cm oder mm stellt unabhängig von der Bildschirmauflösung einheitliche Randgrößen auf Papier sicher.

Zusätzliche Überlegungen:

  • Schriftgrößen:Verwenden Sie die Einheit „pt“ für Schriftgrößen in Printmedien.
  • Browser-Randanpassungen:Browser-Randeinstellungen (gesteuert durch den Browser oder den Druck). Treiber) kann CSS-Ränder überschreiben. Sie können Browser-Druckoptionen wie Kopf- und Fußzeilen sowie Ränder mithilfe von @page-Anweisungen deaktivieren.
  • Internet Explorer-Anpassungen: IE7 und höher passen die Ränder automatisch an den Inhalt an. Um dies zu überschreiben, stellen Sie die Druckgröße in der Druckvorschau auf 100 % ein.
  • @page-Direktive: Verwenden Sie die @page-Direktive, um Ränder außerhalb des HTML-Körperelements festzulegen, was sich auf den Papierrand selbst auswirkt . Diese Direktive funktioniert jedoch möglicherweise nicht in Safari.

Beispiel für die Verwendung von Body- und @page-Direktiven:

<code class="css">body {
  margin: 0px;  /* Margin for content within the HTML body */
}

@page {
  size: auto;
  margin: 25mm 25mm 25mm 25mm;  /* Margin for paper outside the body */
}</code>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonKann ich Druckränder für HTML-Seiten mithilfe von CSS festlegen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage