Supprimer certains styles de css lors de l'impression

Question

Je vais recréer un document en HTML. Thai est tout en cours d'exécution de mon problème est maintenant que je voudrais imprimer la page une fois qu'il a été généré, mais je voudrais supprimer une partie du style CSS appliqué à la vue d'affichage. J'ai ceci jusqu'ici ...

.containerouter { 
    margin:0 auto; 
    width:21cm; 
    height:29.7cm; 
    padding-left:1.7cm; 
    padding-right:1.7cm; 
    padding-bottom:1.7cm; 
    -webkit-box-shadow: -4px 2px 22px 3px rgba(0,0,0,0.19); 
    -moz-box-shadow: -4px 2px 22px 3px rgba(0,0,0,0.19); 
    box-shadow: -4px 2px 22px 3px rgba(0,0,0,0.19); 
} 

    @media print{.no-print, .no-print *{display: none !important;}} 

<div class="containerouter no-print" media="print"> CONTENT NESTED INSIDE THIS DIV NEEDS TO BE PRINTED </div> 

Fondamentalement je voudrais enlever les propriétés d'ombre sans enlever le format de dimensionnement déjà appliqué. Ce qui se passe actuellement est tout le contenu est en train de disparaître lorsque l'impression est cliqué

Answer 1

Il y a une classe de médias pour ajouter des classes lors de l'impression:

@media print { 
    [CSS only shown when printing] 
} 

si vous voulez supprimer certains styles CSS, vous pouvez le faire comme ceci:

@media print { 
    .containerouter { 
     box-shadow: none; 
    } 
} 

Il vous suffit de déclarer l'impression @media après avoir défini la classe afin que votre classe médiatique obtenir une plus grande spécificité.