html - Ved bruk av ngx-print, blir bakgrunnen alltid skrevet ut i hvitt

Faktisk bruker jeg ngx-print npm-biblioteket for å skrive ut min div, det fungerer bra, det eneste problemet er at det ikke viser bakgrunnsfargen som i den ekte:

Min HTML-kode :

<div class="hover-div">
    <button mat-button class="title-div" printSectionId="card-container" 
         printTitle="professionalcard" [useExistingCss]="true" ngxPrint>
            <div fxLayout="row">
                <mat-icon class="preview-icon">print</mat-icon>
                <div>print</div>
            </div>
     </button>
</div>

Har noen støtt på dette problemet før? Hvis ja, hva er løsningen? Takk.

Merk: jeg prøvde også å skrive ut div uten å bruke biblioteket, ved å bruke window.print(), og jeg har alltid det samme problemet.

Svar #1

du kan legge til -webkit-print-color-adjust:exact for å skrive ut bakgrunnen din i ekte farger

Svar #2

Egenskapen -webkit-print-color-adjust er en ikke-standard utvidelse som kan brukes til å tvinge utskrift av bilder og farger som brukes i bakgrunnen for nettlesere basert på WebKit.

Som standard er det initialisert til economy, derfor skrives ikke bakgrunnen ut i de virkelige fargene. For å fikse dette må vi endre verdien til: exact. Dette løste problemet for Google Chrome.

Alternativet til denne CSS-en i Firefox og IE er: color-adjust: exact | economy;.

Nå fungerer det perfekt!

Relaterte artikler