`
conkeyn
  • 浏览: 1506951 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

第1章 CSS和文档局 => link标记 P19

    博客分类:
  • CSS
阅读更多

对于<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中显示的效果如图:

可以在浏览器中选择你想要的样式效果。

  • 大小: 15.3 KB
分享到:
评论

相关推荐

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之4/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之3/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之5/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之6/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之2/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    《CSS Mastery》《 精通CSS》 中文版高清晰 +英文版 +源码下载===>之1/6

    CSS Mastery 精通CSS 中文版高清晰 +英文版 +源码下载&lt;br&gt;CSS Mastery&lt;br&gt;作者: Andy Budd / Simon Collison / Cameron Moll&lt;br&gt;副标题: Advanced Web Standards Solutions (Solutions)&lt;br&gt;&lt;br&gt;简介 ······ ...

    css帮助文档css帮助文档

    css帮助文档css帮助文档css帮助文档css帮助文档css帮助文档css帮助文档css帮助文档css帮助文档css帮助文档

    通过css动画实现一个表格滚动轮播效果

    css动画的一个应用,与此前的css走马灯同样的内容。只是一次不同的应用,具体实现如下 &lt;template&gt; &lt;section&gt; &lt;div class=box&gt; &lt;ul class=header&gt; &lt;li class=cell&gt;序号&lt;/li&gt; &lt;li class=cell&gt;姓名&lt;/li&gt; ...

    elzero-web-school-css-grid-asssignments:==> Elzero Web School CSS作业

    elzero-web-学校-css-grid-assignments ==&gt; Elzero Web School CSS作业作业0作业1作业2

    css framework 漂亮的CSS

    &lt;link rel="stylesheet" href="../css/screen.css" type="text/css" media="screen, projection"&gt; &lt;link rel="stylesheet" href="../css/print.css" type="text/css" media="print"&gt; &lt;!--[if IE]&gt; &lt;link rel=...

    精通HTML5CSS3JavaScript网页设计

    《精通HTML5 CSS3 Javascript网页设计》内容提要:HTML5、cSS3和 Javascript技术是网页设计的精髓,本书以应用实例和综合实战案例的形式逐一详解了 HTML5网页设计的文档结构、文本、图像、用HTML5创建...

    html 帮助文档 css3帮助文档 chm

    html 帮助文档 css3帮助文档 chm html 帮助文档 css3帮助文档 chm html 帮助文档 css3帮助文档 chm

    HTML登陆界面

    href="images/Default.css" type=text/css rel=stylesheet&gt;&lt;LINK href="images/xtree.css" type=text/css rel=stylesheet&gt;&lt;LINK href="images/User_Login.css" type=text/css rel=stylesheet&gt; &lt;META http-equiv=...

    CSS3 3D立体文字变色发光动画特效.zip

     &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d CSS GLOW&lt;/h1&gt;  &lt;h1&gt;3d...

    CSS2.0+CSS3.0的chm文档

    完整的CSS2.0和CSS3.0的chm文档,可以方便地查询CSS的各种属性和用法。

    css帮助文档(例子)

    css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子css 帮助文档 例子

    css2.0 css的文档,2.0标准的

    css2.0 css的文档,2.0标准的 css2.0 css的文档,2.0标准的 css2.0 css的文档,2.0标准的

    CSS文集

    利用CSS的Expression自定义属性来实现表格的OnMouseOver 特效&lt;br&gt;需要掌握的八个CSS布局技巧&lt;br&gt;用css实现链接经过时显示浮动图片背景的效果&lt;br&gt;自适应大小的CSS圆角盒子&lt;br&gt;div+css实现Firefox和IE6兼容的垂直居中...

    HTML 与 CSS3 各种文档

    本资源是HTML与CSS3的各种文档的集合,中间可能会有一些重复

    mab:标记为Ruby; 快速,简洁,功能丰富

    html do head do link :rel =&gt; 'stylesheet' , :href =&gt; 'style.css' script :src =&gt; 'jquery.js' end body :id =&gt; :frontpage do h1 'Hello World' , :class =&gt; :main endend句法1.标签和属性有四种基本形式: ...

Global site tag (gtag.js) - Google Analytics