BLOG main image
분류 전체보기 (31)
웹표준 (28)
기타 (1)
여행 (2)
1105 Visitors up to today!
Today 2 hit, Yesterday 0 hit
daisy rss
tistory 티스토리 가입하기!
2008/01/10 15:22
인쇄용 스타일 

1. media 속성 사용 (컴퓨터 화면에만 적용하는 스타일시트)
<link rel=stylesheer type=text/css media=screen href=screenstyles.css
” />
: 오직 컴퓨터 화면에 적용하기 위한 screenstyle.css 파일을 지정하는 방법

2. @media 혹은 @import
<style type=text/css”>
@import url(screenstyles.css
”) screen;
@media print {
인쇄를 위한 스타일 시트 규칙을 정의합니다 }
</style>

@media 규칙을 이용해 인쇄를 위한 스타일을 지정할 수 있다.
 
예제
<style type=
text/css”>
@import url(screenstyles.css
”) screen;
@media print {
body {color:black; background:none;} }
</style>


3. 여러값 지정


<link rel=stylesheer type=text/css media=screen, print href=screenstyles.css” />
화면과 인쇄 모두에 적용


<style type=text/css”>
@import url(screenstyles.css
”) screen, print;
@media print {
인쇄를 위한 스타일 시트 규칙을 정의합니다 }
</style>

screenstyles.css 는 화면과 인쇄용 모두에 적용이 되고, @media 뒤에 나오는 규칙들은
인쇄에만 적용된다.

4. 화면 스타일과 인쇄 스타일 분리하기
 <link rel=stylesheer type=text/css media=screen href=screenstyles.css” />
 <link rel=stylesheer type=text/css media=print href=print.css” />
 
예제 – print.css
body {font-family:serif; font-size:12pt; background:none;}
#nav, #sidebar, #advertising, #search {
display:none;}

인쇄용 스타일 시트에서 display:none으로 지정한 항목들은 인쇄 시 표시되지 않는다.
배경도 나오지 않게 정의
Trackback Address :: http://marie1114.tistory.com/trackback/28
Name
Password
Homepage
Secret
prev"" #1 #2 #3 #4 #5 #6 #7 #8 #9 ... #31 next