link标签media参数含义详解

发布时间:2019-12-16编辑:脚本学堂
本文介绍了link标签中media参数的具体含义,如果网页打印时与电脑上显示的是一个样式,那么link中media参数,可取值Screen,也可以取值all。

link标签media参数含义

html中<link>标签,它可以引入css,也可以引入一个网站的ico图标,但它后面还有一个media参数,它有什么作用?

常见的<link>用法代码脚本如下:
 

复制代码 代码示例:
<link href="css.css" rel="stylesheet" type="text/css" media="screen" /> 
 

以上是引入网站自定义的CSS文件。(www.jb200.com 脚本学堂 整理)

还可以用来引入网站的ico logo图标,比如:
 

复制代码 代码示例:
<link rel="shortcut icon" href="favicon.ico" media="all" /> 

有时link标签的media属性都空着,不写也没事,不过如果网页需要在不同终端设备上显示,比如打印时显示不同的排版格式,那就需要使用media参数了,比如:
 

复制代码 代码示例:
<link type="text/css" rel="stylesheet" href="stylesheet.css" media="screen" /> 
<link type="text/css" rel="stylesheet" href="printstyle.css" media="print" /> 

代码说明:
当不打印时,使用media="screen"来显示网页,当打印时就调用printstyle.css来显示网页。

以下是media的所有参数及含义:
 

screen 计算机屏幕(默认)。  
tty 电传打字机以及类似的使用等宽字符网格的媒介。  
tv 电视机类型设备(低分辨率、有限的滚屏能力)。  
projection 放映机。  
handheld 手持设备(小屏幕、有限带宽)。  
print 打印预览模式/打印页面。  
braille 盲人点字法反馈设备。  
aural 语音合成器。  
all 适用于所有设备。  

注意,如果网页打印时与电脑上显示的是一个样式,那么link中media参数,可取值Screen,也可以取值all。