HTML <link> 미디어 속성

❮ HTML <링크> 태그

예시

두 가지 다른 미디어 유형(스크린 및 인쇄)에 대한 두 가지 스타일 시트:

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

정의 및 사용

속성 은 media대상 리소스가 최적화된 미디어/장치를 지정합니다.

이 속성은 다양한 미디어 유형에 대해 다른 스타일을 지정하기 위해 CSS 스타일 시트와 함께 주로 사용됩니다.

속성 은 media여러 값을 허용할 수 있습니다.

브라우저 지원

Attribute
media	Yes	Yes	Yes	Yes	Yes

통사론

<link media="value">

가능한 연산자

Value	Description
and	Specifies an AND operator
not	Specifies a NOT operator
,	Specifies an OR operator

장치

Value	Description
all	Default. Used for all media type devices
print	Used for Print preview mode/printed pages
screen	Used for computer screens, tablets, smart-phones etc.
speech	Used for screenreaders that "reads" the page out loud
aural	Deprecated. Speech synthesizers
braille	Deprecated. Braille feedback devices
handheld	Deprecated. Handheld devices (small screen, limited bandwidth)
projection	Deprecated. Projectors
tty	Deprecated. Teletypes and similar media using a fixed-pitch character grid
tv	Deprecated. Television type devices (low resolution, limited scroll ability)

가치

Value	Description
aspect-ratio	Specifies the width/height ratio of the targeted display area. "min-" and "max-" prefixes can be used. Example: media="screen and (max-aspect-ratio:16/9)"
color	Specifies the bits per color of target display. "min-" and "max-" prefixes can be used. Example: media="screen and (min-color:3)"
color-index	Specifies the number of colors the target display can handle. "min-" and "max-" prefixes can be used. Example: media="screen and (min-color-index:256)"
device-aspect-ratio	Deprecated. Specifies the device-width/device-height ratio of the target display/paper.
device-width	Deprecated. Specifies the width of the target display/paper.
device-height	Deprecated. Specifies the height of the target display/paper.
grid	Specifies if the output device is grid or bitmap. Possible values are "1" for grid, and "0" otherwise. Example: media="handheld and (grid:1)"
height	Specifies the height of the targeted display area. "min-" and "max-" prefixes can be used. Example: media="screen and (max-height:700px)"
monochrome	Specifies the bits per pixel in a monochrome frame buffer. "min-" and "max-" prefixes can be used. Example: media="screen and (min-monochrome:2)"
orientation	Specifies the orientation of the target display/paper. Possible values: "portrait" or "landscape" Example: media="all and (orientation: landscape)"
resolution	Specifies the pixel density (dpi or dpcm) of the target display/paper. "min-" and "max-" prefixes can be used. Example: media="print and (min-resolution:300dpi)"
scan	Specifies scanning method of a tv display. Possible values are "progressive" and "interlace". Example: media="tv and (scan:interlace)"
width	Specifies the width of the targeted display area. "min-" and "max-" prefixes can be used. Example: media="screen and (min-width:500px)"

❮ HTML <링크> 태그