Heim >Web-Frontend >CSS-Tutorial >Warum wird die Hintergrundfarbe meiner Tabelle in der Druckvorschau von Chrome nicht angezeigt?

Warum wird die Hintergrundfarbe meiner Tabelle in der Druckvorschau von Chrome nicht angezeigt?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-12-24 14:28:11545Durchsuche

Why Doesn't My Table's Background Color Show in Chrome's Print Preview?

Druckvorschau schließt Hintergrundfarbe aus

Beim Drucken einer Webseite werden bestimmte Hintergrundfarben möglicherweise nicht in der Druckvorschau angezeigt. Konkret wird die einer Tabelle zugewiesene Hintergrundfarbe nicht in der Druckvorschau von Chrome angezeigt.

Die folgende CSS-Eigenschaft wurde erfolglos angewendet:

-webkit-print-color-adjust: exact;

Problem wird gelöst

Während die CSS-Eigenschaft print-color-adjust: Exact; funktioniert, gibt es grundlegende Schritte zur Fehlerbehebung, um sicherzustellen, dass das gewünschte CSS beim Drucken wirksam wird.

  1. Druck- und Bildschirm-CSS trennen:

    • Implementieren Sie Medienabfragen, um CSS-Stile für den Druck (@media print) von denen für die Bildschirmanzeige (@media) zu unterscheiden Bildschirm).
  2. Erhöhte CSS-Spezifität:

    • In diesem Fall ist die Eigenschaft „print-color-adjust“ funktionsfähig , aber andere CSS-Regeln mit höherer Spezifität überschreiben es. Um dieses Problem zu beheben, verwenden Sie die !important-Deklaration in den @media-Druckregeln:
@media print {
    tr.vendorListHeading {
        background-color: #1a4567 !important;
        print-color-adjust: exact; 
    }
}

@media print {
    .vendorListHeading th {
        color: white !important;
    }
}

Das obige ist der detaillierte Inhalt vonWarum wird die Hintergrundfarbe meiner Tabelle in der Druckvorschau von Chrome nicht angezeigt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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