css优先级：
1、浏览器默认
2、外部样式表
3、内嵌样式表（在HEAD标签里的）
4、行内样式Inline style
当发生css的冲突时，遵循“谁具体听谁的”的原则。比如id selector就比class selector更具体，冲突时就会以id selector为准。而Inline style比id selector优先级更高。
css语法由3个部分组成：选择器（selector）、属性、值。
语法 selector { property: value}
选择器就是我们希望去定义的HTML标签，如：
body { color: black}
p { font-family: "sans serif"}
p { text-align: center; color: red}
其中，值如果有多个单词要加双引号；属性如果有多个要用分号隔开。
另外，冒号两边不要带空格。
也可以分行描述：
p{
text-align: center;
color: black;
font-family: arial
}
可以将selector写在一起，以逗号隔开
h1,h2,h3,h4,h5,h6 { color: green}
选择器类（class selector）--同一个元素显示不同的样式
有时在网页中不是希望“一视同仁”，比如不是所有的段落都居中，那么可以这么写：
p.right{text-align:right}
p.center{text-align:center}
这里的p.right的right是自己定义的class，可以随便叫什么，但是不要以数字开头
然后在HTML中用类属性引用：
<p class="right">right</p>
<p class="center">center</p>
注意：每个html元素只能用一个class，比如这样写是不符合规范的：<p class="right" class="center">
可以省略标签直接定义，这意味着所有html元素只要引用这个class均会执行。如：
.center{text-align:center}
id选择器（id selector）--不同的元素显示同样的样式
--为不同的html元素定义相同的样式，通过id属性实现
比如这个样式规则： #green{color:green}
这个规则能匹配下面：
<h1 id="green"></h1>
<p id="green"></p>
还可以这么写： p#green{color:green}
这个规则指定了能匹配所有带id属性值为green的p标签
css的注释： /* */
如何在html中引入css？
外部样式表：
<link rel="stylesheet" type="text/css" href="mystyle.css">
内嵌样式表：
<head>
<style type="text/css">
hr{color:red}
p{margin-left:20px}
body{backgroud-image:url("images/back40.gif")}
</style>
</head>
行内样式表：
<p style="color:red;margin-left:20px"></p>
一般不推荐使用行内样式表，因为css的目的就是把内容和形式分开。而行内样式表又是混淆在一起的。
伪类 psuedo class(编辑顺序 l-->v-->h-->a)
link 未被访问前的样式
visited 其链接地址已被访问过时的样式
hover 鼠标悬停时的样式
active 被用户激活(在鼠标点击与释放之间发生的事件)时的样式
下面是一个例子：
body{background-color:orange}
h1{color:green;font-size:20pt}
hr{color:red}
p{font-size:11pt;margin-left:15px}
a:link {color:green}
a:visited {color:yellow}
a:hover {color:black}
a:active {color:blue}
1、浏览器默认
2、外部样式表
3、内嵌样式表（在HEAD标签里的）
4、行内样式Inline style
当发生css的冲突时，遵循“谁具体听谁的”的原则。比如id selector就比class selector更具体，冲突时就会以id selector为准。而Inline style比id selector优先级更高。
css语法由3个部分组成：选择器（selector）、属性、值。
语法 selector { property: value}
选择器就是我们希望去定义的HTML标签，如：
body { color: black}
p { font-family: "sans serif"}
p { text-align: center; color: red}
其中，值如果有多个单词要加双引号；属性如果有多个要用分号隔开。
另外，冒号两边不要带空格。
也可以分行描述：
p{
text-align: center;
color: black;
font-family: arial
}
可以将selector写在一起，以逗号隔开
h1,h2,h3,h4,h5,h6 { color: green}
选择器类（class selector）--同一个元素显示不同的样式
有时在网页中不是希望“一视同仁”，比如不是所有的段落都居中，那么可以这么写：
p.right{text-align:right}
p.center{text-align:center}
这里的p.right的right是自己定义的class，可以随便叫什么，但是不要以数字开头
然后在HTML中用类属性引用：
<p class="right">right</p>
<p class="center">center</p>
注意：每个html元素只能用一个class，比如这样写是不符合规范的：<p class="right" class="center">
可以省略标签直接定义，这意味着所有html元素只要引用这个class均会执行。如：
.center{text-align:center}
id选择器（id selector）--不同的元素显示同样的样式
--为不同的html元素定义相同的样式，通过id属性实现
比如这个样式规则： #green{color:green}
这个规则能匹配下面：
<h1 id="green"></h1>
<p id="green"></p>
还可以这么写： p#green{color:green}
这个规则指定了能匹配所有带id属性值为green的p标签
css的注释： /* */
如何在html中引入css？
外部样式表：
<link rel="stylesheet" type="text/css" href="mystyle.css">
内嵌样式表：
<head>
<style type="text/css">
hr{color:red}
p{margin-left:20px}
body{backgroud-image:url("images/back40.gif")}
</style>
</head>
行内样式表：
<p style="color:red;margin-left:20px"></p>
一般不推荐使用行内样式表，因为css的目的就是把内容和形式分开。而行内样式表又是混淆在一起的。
伪类 psuedo class(编辑顺序 l-->v-->h-->a)
link 未被访问前的样式
visited 其链接地址已被访问过时的样式
hover 鼠标悬停时的样式
active 被用户激活(在鼠标点击与释放之间发生的事件)时的样式
下面是一个例子：
body{background-color:orange}
h1{color:green;font-size:20pt}
hr{color:red}
p{font-size:11pt;margin-left:15px}
a:link {color:green}
a:visited {color:yellow}
a:hover {color:black}
a:active {color:blue}
1815
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
