DIV+CSS(一) 4种样式表 和 6种 样式 规则 选择器
1. <div> 中可以嵌套任何标签2. <div> 中可以嵌套 <p> 标签，但反之，
不应该在 <p> 标签中 嵌套<div>标签，
因为结果是不确定的。
3. 层叠样式表（Cascading Style Sheet）
4. 样式表的分类有 4 种
内联式样式表
嵌入式样式表
外部样式表
输入样式表
内联式样式表 的例子：
<p style="font-size:3cm; color:rend; background-color:green">aaaaaa</p>
嵌入式样式表 的例子：
<html> <title></title> <style type="text/css"> <!-- p { font-size:3cm; color:red; background-color:green; text-decoration:underline } //--> </style> <html>
外部样式表 的例子：
<html><head> <title></title> <link rel="stylesheet" type="text/css" href="style/test.css"></head><body> <p>aaaaaaaaaaaaaa</p> <p>bbbbbbbbbbbbbb</p> <p>cccccccccccccc</p></body></html>
假定在 style 文件夹下有 test.css 和 demo.css 文件,
输入样式表的 例子(一)：
则 test.css 的内容 类似于下面：
p { font-size:3cm; color:red; background-color:green; text-decoration:underline } @import url(demo.css);
输入样式表的 例子(二)：
<html> <head> <title></title> <style> <!-- @import url(style/test.css); //--> </style> </head> </html>
5. 样式规则的 选择器
html selector
class selector
id selector
关联 选择器
组合 选择器
伪元素 选择器
html selector 的例子
p {font-size:15px; color:yellow}
class selector 的例子
.aaa {font-size:15px; color:yellow}
或
p.aaa {font-size:15px; color:yellow}
id selector 的例子
#aaa {font-size:15px; color:yellow}
关联选择器的 例子
p em {font-size:15px; color:yellow}
组合选择器 的例子
p, div, .aaa, #bbb {font-size:15px; color:yellow}
伪元素选择器 的例子
a:link {font-size:1cm; color:red} a:hover {font-size:5cm; color:green} a:visited {font-size:2cm; color:yellow}
稍作变化
a.one:link {font-size:1cm; color:red} a.two:hover {font-size:5cm; color:green} a.three:visited {font-size:2cm; color:yellow}
页:
[1]