예
인쇄에 사용할 스타일을 지정합니다 :
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style> »그것을 자신을 시도 정의 및 사용
media 속성은 CSS 스타일에 최적화되어 어떤 미디어 / 디바이스를 지정합니다.
이 속성은 스타일이 특별한 (아이폰 같은) 장치, 음성 또는 인쇄 용지로 지정하는 데 사용됩니다.
팁 :이 속성은 여러 값을 받아 들일 수 있습니다.
브라우저 지원
| 속성 | |||||
|---|---|---|---|---|---|
| media | 예 | 예 | 예 | 예 | 예 |
HTML 4.01과 HTML5의 차이점
없음.
통사론
<style media="value">
가능한 Operators
| 값 | 기술 |
|---|---|
| and | 는 AND 연산자를 지정합니다 |
| not | 해당 없음 연산자를 지정합니다 |
| , | 는 OR 연산자를 지정 |
장치
| 값 | 기술 |
|---|---|
| all | 태만. 모든 장치에 적합 |
| aural | 음성 합성기 |
| braille | 점자 피드백 장치 |
| handheld | 핸드 헬드 장치 (작은 화면, 제한된 대역폭) |
| projection | 영사기 |
| 인쇄 미리보기 모드 / 인쇄 된 페이지 | |
| screen | 컴퓨터 화면 |
| tty | 고정 피치 문자 격자를 사용하여 텔레타이프와 유사한 미디어 |
| tv | 텔레비전 유형 장치 (저해상도 제한 스크롤 기능) |
값
| 값 | 기술 |
|---|---|
| 폭 | 타겟 표시 영역의 폭을 지정한다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (min-width:500px)" |
| 신장 | 목표 디스플레이 영역의 높이를 지정한다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (max-height:700px)" |
| 장치 폭 | 대상 디스플레이 / 용지의 폭을 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (device-width:500px)" |
| 장치 높이 | 대상 디스플레이 / 용지의 높이를 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (device-height:500px)" |
| 정위 | 대상 디스플레이 / 용지의 방향을 지정합니다. 가능한 값 : "portrait" 또는 "landscape" 예 : media="all and (orientation: landscape)" |
| 종횡비 | 목표 디스플레이 영역의 폭 / 높이 비율을 지정한다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (aspect-ratio:16/9)" |
| 장치 종횡비 | 대상 디스플레이 / 용지의 장치 폭 / 장치 - 높이 비율을 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (aspect-ratio:16/9)" |
| 색 | 대상 디스플레이의 색상 당 비트를 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (color:3)" |
| 색상 색인 | 대상 디스플레이가 처리 할 수있는 색상의 수를 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (min-color-index:256)" |
| 단색화 | 흑백 프레임 버퍼의 픽셀 당 비트를 지정한다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="screen and (monochrome:2)" |
| 해결 | 대상 디스플레이 / 용지의 픽셀 밀도 (dpi의 또는 DPCM)를 지정합니다. "min-" 및 "max-" 프리픽스가 사용될 수있다. 예 : media="print and (resolution:300dpi)" |
| 주사 | TV 디스플레이의 주사 방법을 지정한다. 가능한 값은 "진보"와 "인터레이스"입니다. 예 : media="tv and (scan:interlace)" |
| 그리드 | 출력 장치는 격자 또는 맵인지를 지정. 가능한 값은 그리드에 대해 "1"이고, 그렇지 않으면 "0". 예 : media="handheld and (grid:1)" |