HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML style media 속성

media 속성은 CSS 스타일이 어떤 미디어에 대한 것인지 지정합니다/장치가 최적화되었습니다. 이 속성은 특정 장치(예: iPhone), 음성 또는 인쇄 매체에 사용할 스타일을 지정하는 데 사용됩니다.

온라인 예제

인쇄에 사용할 스타일 지정:

예제

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML source media 속성 사용-기본 가이드(oldtoolbag.com)</title>
<style media="print">
h1　{color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
</head>
<body>
<h1>oldtoolbag.com 예제</h1>
<p>이 페이지를 인쇄하거나 인쇄 미리보기에서 열면 media　=“　print” 스타일 시트를 사용하여 스타일링된 것을 볼 수 있습니다. “인쇄” 스타일 시트는 흰 배경에 검은 텍스트를 포함합니다.</p>
</body>
</html>

시험해 보세요 ‹/›

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 media 속성을 지원합니다.

정의와 사용법

media 속성은 CSS 스타일이 어떤 미디어에 대한 것인지 지정합니다/장치가 최적화되었습니다.
이 속성은 특정 장치(예: iPhone)와 오디오 또는 인쇄 미디어에 사용되는 스타일을 지정합니다.
힌트: 이 속성은 여러 값을 받을 수 있습니다.

HTML 4.01 HTML과5차이점

없음.

문법

<style media="value">

가능한 연산자

값	설명
and	AND 연산자를 지정.
not	NOT 연산자를 지정.
,	OR 연산자를 지정.

장치

값	설명
all	기본. 모든 장치에 적용.
aural	오디오 시뮬레이터。
braille	시각 장애인용 점자 기기.
handheld	핸드 헬드 장치(작은 스크린, 제한된 밴드위드)。
projection	프로젝션 기계。
print	인쇄 미리보기 모드 / 인쇄 페이지。
screen	컴퓨터 스크린(기본 값)。
tty	텔레그램 프린터 및 일반적인 가로 길이网格를 사용하는 유사 매체.
tv	TV 유형 장치(저 해상도, 제한된 스크린 롤링 능력)。

값

값	설명
width	목표 디스플레이 영역의 너비. "min" 사용 가능.-"과 "max-" 접두사. 예제：media="screen and (min-width:500px)"
height	목표 디스플레이 영역의 높이. "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (max-height:700px)"
device-width	목표 디스플레이를 지정합니다./용지의 너비. "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (device-width:500px)"
device-height	목표 디스플레이를 지정합니다./용지의 높이. "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (device-height:500px)"
orientation	목표 디스플레이를 지정합니다./용지의 방향. 가능한 값: "portrait" 또는 "landscape" 예제: media="all and (orientation: landscape)"
aspect-ratio	목표 디스플레이 영역의 너비/높이 비율 "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio	목표 디스플레이를 지정합니다./용지의 device-width/device-height 비율 "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (aspect-ratio:16/9)"
color	목표 디스플레이의 bits/color "min" 사용 가능.-"과 "max-" 접두사. 예제: media="screen and (color:3)"
color-index	목표 디스플레이가 처리할 수 있는 색상 수를 지정합니다. "min" 사용 가능.-"과 "max-" 접두사. 예제：media="screen and (min-color-index:256)"
monochrome	단색 프레임 버퍼의 bits를 지정합니다./pixel. "min" 사용 가능.-"과 "max-" 접두사. 예제：media="screen and (monochrome:2)"
resolution	목표 디스플레이를 지정합니다./지시서의 픽셀 밀도 (dpi 또는 dpcm). "min" 사용 가능.-"과 "max-" 접두사. 예제：media="print and (resolution:300dpi)"
scan	tv 디스플레이의 스캔 방식을 지정합니다. 가능한 값："progressive"과 "interlace"입니다. 예제：media="tv and (scan:interlace)"
grid	출력 장치가 그리드 또는 비트맵인지 지정합니다. 가능한 값:"1"은 그리드로, 그렇지 않으면 "0"입니다. 예제：media="handheld and (grid:1)"

　HTML <style> 태그

HTML: <template> 태그