HTML链接媒体属性用于指定优化目标资源的媒体/设备。此属性用于为不同的媒体类型指定不同的样式。
媒体属性可以接受多个值。
用法:
<link media="value">
可能的操作符:
值 | 描述 |
---|---|
and | AND运算符 |
not | 非运算符 |
, | 或运算符 |
设备:
值 | 描述 |
---|---|
all | 适用于所有设备 |
aural | 语音合成器 |
braille | 盲文反馈设备 |
handheld | 手持设备(小屏幕,带宽有限) |
projection | Projectors |
打印预览模式/打印页面 | |
screen | 电脑屏幕 |
tty | 使用固定间距字符网格的电传打字机和类似媒体 |
tv | 低分辨率或滚动能力有限的设备,例如电视。 |
值:
值 | 描述 |
---|---|
width | 目标显示区域的宽度。 |
height | 目标显示区域的高度 |
device-width | 目标显示或纸张的宽度。 |
device-height | 目标显示或纸张的高度。 |
orientation | 目标显示或纸张的方向。 |
aspect-ratio | 目标显示区域的宽高比。 |
device-aspect-ratio | 目标显示器/纸张的Device-width /device-height比。 |
color | 目标显示的每种颜色的位数。 |
color-index | 目标显示器可以处理的颜色数。 |
monochrome | 单色帧缓冲区中每个像素的位数。 |
resolution | 目标显示屏/纸张的像素密度(dpi或dpcm)。 |
scan | 电视显示器的扫描方法。 |
grid | 如果输出设备是网格或位图。 |
注意:可以使用前缀“ min-”和“ max-”。
例:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
type="text/css"
href="index_screen.css">
<link rel="stylesheet"
type="text/css"
href="index_print.css"
media="print">
</head>
<body>
<center>
<h1>GeeksforGeeks</h1>
<p><a href="index.html" target="_blank">
Click here
</a>
</center>
</body>
</html>
输出:
支持的浏览器:下面列出了HTML链接媒体属性支持的浏览器:
- 谷歌浏览器
- IE浏览器
- Firefox
- 苹果Safari
- Opera
相关用法
- HTML media属性用法及代码示例
- HTML <a> media属性用法及代码示例
- HTML <style> media属性用法及代码示例
- HTML <area> media属性用法及代码示例
- HTML <source> media属性用法及代码示例
- HTML min属性用法及代码示例
- HTML value属性用法及代码示例
- HTML <li> value属性用法及代码示例
- HTML max属性用法及代码示例
- HTML <bdo> dir属性用法及代码示例
- HTML <a> rel属性用法及代码示例
- HTML name属性用法及代码示例
- HTML dir属性用法及代码示例
注:本文由纯净天空筛选整理自Vijay Sirra大神的英文原创作品 HTML | <link> media Attribute。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。