CSS/SCSS/bootstrap :: nadpisanie ustawień drukowania w bootstrap :: zmiana tła: przezroczysty! ważne dla koloru

Question

Mam problem z bootstrapem CSS/print.

W bootstrap CSS (reset.css) wszystko jest wyczyszczone do drukowania

@media print { 
    * { 
    text-shadow: none !important; 
    color: black !important; 
    background: transparent !important; 
    box-shadow: none !important; 
    } 
} 

Ale muszę wydrukować kilka wierszy w kolorze. Moja tabela wygląda następująco:

<div class="container"> 
    <div id="task-summary"> 
     <div id="process-summary"> 
      <table class="table table-condensed"> 
       <tbody> 
        <tr class="success"> 
         <td> 

I osadzone to do mojego kodu, ale to nie działa:

@media print { 

    #task-summary{ 
    .success{ 
     background-color: #DFF0D7 !important; 
    } 
    } 
} 

Ja już próbowałem jeśli CSS jest wykluczone za pomocą display: none .. działa (linia nie jest wyświetlana) i wydaje się być na właściwym miejscu.

Czy ktoś ma pomysł, jak mogę zastąpić polecenie bootstrap css, bez edytowania reset.css z bootstrap?

Answer 1

@media print { 
    .success { 
     background-color: #DFF0D7 !important; 
    }  
} 

Albo

@media print { 
    #task-summary .success { 
     background-color: #DFF0D7 !important; 
    } 
} 

Albo

@media print { 
    #task-summary > #process-summary .success { 
     background-color: #DFF0D7; 
    } 
} 

Answer 2

miałem ten sam problem. Podczas drukowania strony opcja background-color: ...; nie działa w wierszach tabeli. Zmień CSS-Selector na:

@media print { 

    #task-summary .success td { 
    background-color: #DFF0D7 !important; 

    /* add this line for better support in chrome */ 
    -webkit-print-color-adjust:exact; 
    } 
} 

Wszystko powinno działać po tych zmianach.