Css权威指南学习笔记之第一章候选样式表

最新推荐文章于 2022-07-08 20:34:54 发布

韦奕

最新推荐文章于 2022-07-08 20:34:54 发布

阅读量1.1k

点赞数 1

分类专栏： css权威指南笔记文章标签： css

本文链接：https://blog.csdn.net/weiyi89/article/details/13646187

版权

笔记同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

css权威指南

1 篇文章 0 订阅

订阅专栏

本文介绍了CSS中的候选样式表概念，允许页面拥有多种风格供用户选择。通过创建red.css、blue.css和green.css三个不同颜色的样式表，并在HTML中使用`<link>`标签设置，用户可以在浏览器中切换页面的文本颜色。默认情况下，不选择任何样式表时，文本将按浏览器默认样式（通常是黑色）显示。实验表明，Firefox和IE（至少从7到10）支持此功能，但Chrome的切换位置未找到。由于该功能不常用，作者计划在实际需求出现时再深入研究。

摘要由CSDN通过智能技术生成

候选样式表, 就是允许为一个页面提供多种风格的样式表,用户在浏览该页面时可以选择自己喜欢的页面风格.

具体做法通过下面一个例子来说明:

1.建立3个css文件

red.css:

p {color: red;}

blue.css

p {color: blue;}

green.css:

p {color: green;}

2.建立一个html文件

demo.html:

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8"/>
       <title>Alternate Style Sheet</title>
       <link rel="stylesheet" type="text/css" href="red.css" title="Red" />
       <link rel="alternate stylesheet" type="text/css" href="green.css" title="Green" />
       <link rel="alternate stylesheet" type="text/css" href="blue.css" title="Blue" />
   </head>
   <body>
       <p>Hello,gays, I'm a paragraph!! And my color will changes according to the style sheet you choose.</p>
   </body>
</html>

3.在浏览器中打开上面的html文件