Czy istnieje sposób użycia tego samego arkusza stylów CSS dla nośników wydruku i układu domyślnego?

Question

Szukam sposobu użycia tego samego arkusza stylów dla mediów drukowanych, jak dla domyślnego układu ekranu. Korzyścią dla mnie będzie to, że nie będę musiał aktualizować 2 plików za każdym razem, gdy aktualizuję CSS. Wolałbym mieć jeden arkusz stylów i określić specjalne zasady dla mediów drukowanych, oznaczając je w jakiś sposób ... To może nie być możliwe, ale pomyślałem, że postawię to pytanie.

Answer 1

Jest to składnia, choć szczerze mówiąc nie wiem, czy to jest obsługiwana we wszystkich przeglądarkach (powinien być):

@media print { 
    body { 
     background: #fff; 
     color: #000; 
    } 
    /* etc */ 
} 

Zobacz media part of the CSS2 standard at W3.

Answer 2

Jeśli chcesz, aby style były takie same na wszystkich nośnikach, po prostu zdefiniuj popularne style w arkuszu stylów jako normalne (tj. Nie w żadnej regule mediów), a następnie umieść elementy specyficzne dla nośnika w odpowiednich regułach.

Jeśli chcesz niektóre style zastosować do podzbioru mediów, można zrobić to tak:

@media print { 
    body { font-size: 10pt } 
} 
@media screen { 
    body { font-size: 13px } 
} 
@media screen, print { 
    body { line-height: 1.2 } 
} 

Oto link do relevant W3C page