概述CSS（Cascading Style Sheets--层叠样式表）
CSS辅助HTML写页面
Paste_Image.png
语法
<style type="text/css">
选择器{
属性：值；
}
</style>
CSS语法
CSS与HTML的结合方式（掌握）
1.行级样式表，可以写在开始标签里面，采用style属性完成
例如：<p style = color:red></p>
2.内部样式表（在title和head间写style；在body中引用），采用style标签完成(表明它是css代码)
<style type="text/css"> //type表明这是文本类型的css代码
选择器{
属性：值；
}
</style>
3.外部样式表：采用外部css文件完成
使用<link></link>标签来引进外部css文件
属性：
rel = "stylesgeet" 必须写
href = "a.css" (相对路径)
<link rel = "stylesheet" href = "a.css"></link>
<title>Document</title>
CSS的基本选择器
基本选择器
a.标签选择器：选择了页面上一类标签
b.类选择器：规定用圆点来定义（当对页面上不同种的标签想使用相同 的属性的时候）
在style标签中用 .类名{属性}
例如
.one{
border:1px solid red; //solid实线
}
在body的行级标签中进行引用
<p class = ".one">你好</p>
c.ID选择器：用#来定义，针对特定的一个标签用（id具有唯一性）
在style标签中用 .ID名{属性}
例如
#two{
border:3px dashed green; //dashed表示虚线
}
在body的行级标签中进行引用
<p id = "two">你好</p>
d.通用选择器：用*来定义，代表页面上所有标签
在style标签中用 *{属性}
例如
*{
border:3px dashed green; //dashed表示虚线
}
CSS的扩展选择器
a.组合选择器：用逗号隔开多个选择器
标签，标签，标签，#one，.two...{属性；}
b.关联选择器：（后代选择器）：用空格隔开
例如 h3 i{
color:red;
}
<h3>我来自<i>中国</i>大陆</h3>
<i>香港</i>
此时只有"中国"会有斜体红色效果，"香港"只有斜体效果
c.伪类选择器
1）：静态伪类 ：link， ：visited,只能用于超链接
---
style中写：
a:link{
color:red;
}
a:visited{
color:green;
}
body中写：
<a href = " ">一个网站</a>
效果是：点击前链接为红色，点击后链接为绿色
---
2） 动态伪类：适用于各种标签
：focus：控件获得焦点
：active 点击控件的时候
：hover 当鼠标移动到某个控件上方的时候（比如表格 ，例如定义cursor = hand，当鼠标放在表格上时鼠标变成手的形状）
例如（style中）：
input:focus{
border:5px solid red;
background-color:#0000FF
}
body中：<input type = "text" name = "">
效果：点击文本框的时候文本框属性会发生改变
表格(在body中创建一个表格table)
table{
width = 300px;
height = 300px;
border:1px solid red;
}
table td{
border:1px solid red
}
table
此时可以使用属性：
border-collapse:collapse;来将双线变单线
Paste_Image.png
table tr:hover{
background-color:yellow;
}
quanli.gif
a{ } 与 a:link{ }的区别：
a{}包括了锚点；a:link{}不包括锚点
