对于<link>标签的属性详解:
rel代表“关系”(relation),在这里,关系为stylesheet
type总是设置为text/css
media属性,一般使用all,这个属性有很多可取值,如:
all:用于所有表现媒体;
aural:用于语音合成器,屏幕阅读器和文档的其他声音表现。
braille:用Braille设备表现文档时使用。
embossed:用Braille打印设备打印时使用。
handeld:用于手持设备,如个数字助理或支持WEB的蜂窝电话。
print:为视力正常的用户打印文档时使用,另外还会在显示文档的“打印预览”时使用。
projection:用于投影媒体,如发表演讲时显示幻灯片的数字投影仪。
screen:在屏幕媒婆(如桌面计算机监视器)中表现文档时使用。在这种系统上运行的所有WEB浏览器都是屏幕媒体用户代理。
tty:在固定间距环境(如电传打字机)中显示文档时使用。
tv在电视上显示文档时使用。
Opera还支持projection,允许文档作为幻灯片显示。
可以在多个媒体中使用一个样式表,为此要提供应用此样表的媒体列表,各媒体用逗号分隔。例如,可以在屏幕和投影媒体中使用一个链接样式表:
<link rel="stylesheet" type="text/css" href="visual-sheet.css" media="screen,projection"/>
候选样式表
还可以定义候选样式表(alternate style sheet)。将rel属性的值置为alternate stylesheet,就可以定义候选样式表,只有在用户选择这个样式表时才会用于文档表现。
如果浏览器能使用候选样式表,它会使用link元素的title属笥值生成一个候选样式列表。可以设置以下元素:
<link rel="alternate stylesheet" title="Default" type="text/css" href="default-sheet.css" media="screen,projection"/>
<link rel="alternate stylesheet" title="Big text" type="text/css" href="big-text-sheet.css" media="screen,projection"/>
<link rel="alternate stylesheet" title="Crazy colors" type="text/css" href="crazy-colors-sheet.css" media="all"/>
在firefox中显示的效果如图:
可以在浏览器中选择你想要的样式效果。