[Info]Tags categorized posts and contents patterns..

[AJAX] Ajax Code E xamples.. [Book] About the book.. [CSS] CSS Code E xamples.. [DB] Sql Code E xamples.. [DEV] All development stor...

2016년 2월 25일 목요일

[CSS]CSS의 Media Type에 대해서..

출처 : Outsider's Dev Story https://blog.outsider.ne.kr/

언젠가 부터 CSS를 불러들이는 소스에서 Media Type를 지정하는 것을 봤다. 처음 본건 이 블로그 엔진이기도 한 TextCube에서였던것 같다. CSS는 이런 자원에 대해서 설명되어 있는 책을 찾기가 쉽지 않아서 궁금하면서 그냥 미루고 있었는데 이번에 알게 되었다.

1
2
<link rel="stylesheet" media="screen" type="text/css" href="/skin/balance_black/style.css" />
<link rel="stylesheet" media="print" type="text/css" href="/skin/balance_black/styles/print.css" />

이 블로그에서도 CSS가 위처럼 지정된다. 여기서 media가 screen이나 print로 지정되어 있다. 이 Media Type를 얘기하는 거다.

all : 모든 종류의 장비
aural : 목소리나 사운드에 대한 장비
braille : 점자 피드백 장비
embossed : 페이지 점자 프린터
handheld : 소형 또는 휴대용 장비
print : 프린터
projection : 슬라이드 같은 프리젠테이션
screen : 컴퓨터 화면
tty : 텔레타이프나 터미널 같은 고정간격 글자를 사용하는 미디어장비
tv : 텔레비전 같은 장비

이건 프린터나 모바일용을 위해서 페이지를 따로 만들지 않고 페이지는 그대로 놔둔채로 CSS규칙만으로 각 장비에 알맞은 화면을 구성하여 보여줄 수 있는 것이다. 이중에 주로 사용할 것은 screen, print정도겠지만 지정만 잘 해놓으면 페이지 하나만 가지고 여러가지 접근성을 제공할 수 있으니 아주 편리한 거였군... ㅎ

미디어 타입은 대소문자를 가리기 때문에 소문자로 적어주어야 한다.

My Comment..
OMG 다.. 오 마이 가뜨.. 포스팅을 옮겨오면서..
머 이런게 있나.. media 는 어디에 쓰는 물건인고..?? 라는 생각을 했는데.. ㅋㅋ..
ㅡㅡ.. 된장.. 지금 일하는 BC 에서도 쓰고 있었다..

혹시나 해서 이클립스에서 검색해보니.. 있다..한 두개가 아닌..
은근 마니.. 쓰고 있더라.. 이런 이런.. 퍼블은 디자인팀에서 보내주면..
내가 개발해야 될 부분 내지는 틀만 맞추고.. 나머지 부분은 전혀 신경을 안썼는데..

이 글 덕분에.. 저렇게 선언하는 부분이 있었구나 하고 알게 되었넹.. ㅎㅎ..


댓글 없음:

댓글 쓰기