background-color 프린트하기

웹페이지를 프린트하는데 background-color, color 속성이 적용되지 않고 무시됐습니다.

프린트 시 레이아웃 고정을 위해 @media print 를 사용하는 전용 스타일시트를 사용중이었습니다.

<link rel="stylesheet" media="print" type="text/css" href="print.css" />

브라우저의 프린트 옵션에서, background graphics 를 체크해 프린트. 실패.

IE 역시 비슷한 옵션이 존재했지만 IE에서도 실패.

검색결과, 아래 CSS를 통해 해결할 수 있다는 대부분의 글을 확인했지만 적용되지 않았습니다. (크롬 사용)

@media print{
  .target {
    -webkit-print-color-adjust: exact !important;
  }
}

background-color 속성을 background로 변경하면 적용된다는 글을 확인. 적용안됨

!important 를 background-color 와 color 에 박아넣으니 크롬, IE, 파폭 모두 정상적으로 출력됨을 확인했습니다.

뭐가 문제였는지는 모르겠지만 아무튼 나중을 위해 삽질기 남겨둡니다..

저장소