CSS 指层叠样式表 (Cascading Style Sheets)解决内容与表现分离的问题。
为什么要这么做呢？这么做的目的是为了在图形浏览器中获得品牌化的外观和感觉的同时，在文本浏览器、无线设备、HTML 格式的电子邮件中，文档的结构得到保留。
所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，优先级从低到高。类似于同名覆盖，函数从写。
- 浏览器缺省设置
- 外部样式表
- 内部样式表（位于 <head> 标签内部）
- 内联样式（在 HTML 元素内部）
每条声明由一个属性和一个值组成。属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。比如color：red；
selector {declaration1; declaration2; ... declarationN }selector {property: value}h1 {color:red; font-size:14px;}是否包含空格不会影响 CSS 在浏览器的工作效果，同样，与 XHTML 不同，CSS 对大小写不敏感。不过存在一个例外：如果涉及到与 HTML 文档一起工作的话，class 和 id 名称对大小写是敏感的。
对选择器进行分组，这样，被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。多个HTML元素在一起定义。
h1,h2,h3,h4,h5,h6 {
color: green;
}根据 CSS，子元素从父元素继承属性。个别的不想继承父元素属性的可以再次定义子属性实现覆盖。
strong {
color: red;
}
h2 {
color: red;
}
h2 strong {
color: blue;
}每个名字只能在被赋予的页面使用一次。（例如，假如你的页面包含 id 为 content 的 div，那么另外一个 div 或者其他别的元素都不能使用这个名字。相反地，class 属性可以被一遍又一遍地使用在页面中（例如，页面中的五个段落都可以使用名为 "small" 或者"footnote" 的 class 名称）。
外部样式表：你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表。<link> 标签在（文档的）头部。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>hr {color: sienna;}
p {margin-left: 20px;}
body {background-image: url("images/back40.gif");}<head>
<style type="text/css">
hr {color: sienna;}
p {margin-left: 20px;}
body {background-image: url("images/back40.gif");}
</style>
</head><p style="color: sienna; margin-left: 20px">
This is a paragraph
</p>多重样式：如果某些属性在不同的样式表中被同样的选择器定义，那么属性值将从更具体的样式表中被继承过来。比如内部样式表和外部样式表都有关于<h1>的样式声明，那么不同的属性会被叠加，相同的属性会按照优先级的先后选择一个表达出来，即是内部样式表的格式会覆盖外部样式表。
扫一扫
84
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
