层叠样式表(英文全称：Cascading Style Sheets)
css使用方法：
· 行内样式（内联样式）
· 内部样式表（嵌入样式）
· 外部样式表（Link链入）
· 导入式
css行内样式：
· 在开始标签内添加style样式属性
· 如：<p style="color:red;">内容</p>
css内部样式：
内部样式（嵌入样式），把css样式代码写在：
<style type="text/css">
样式...
</style>
说明：<style>要放在<head>标签之间
css外部样式：
外部样式表，把css样式代码写在独立的一个文件中
扩展名：css文件名.css
引入外部文件：
<link href="xx.css" rel="stylesheet" type="text/css" />
说明：<link>要放在<head>标签之间
css导入式
@import "外部css样式"
说明：@import写在<style>标签内最开始
css应用优先级：
行内样式>内部样式>外部样式
ps：内部样式与外部样式的优先级取决于所处的位置，离元素越近优先级越高
最后定义的优先级最高
css选择器
标签选择器 类选择器 ID选择器 全局选择器 群组选择器 后代选择器
标签选择器：
以标签名字作为选择器
p{
color:red;
}
类选择器：
为html标签添加class属性
<h1 calss="blue">内容</h1>
通过类选择器为带有calss属性的html标签添加样式
.blue{
color:blue;
}
可对不同类型元素的同一个名称的类选择器设置不同的样式规则
h1.class{
color:blue;
}
p.class{
font-size:30px;
}
<h1 class="text">内容</h1>
<p class="text">内容</p>
同一个元素可以设置多个类，中间用空格隔开
<p calss="red fsize">内容</p>
ID选择器
为html标签添加ID属性
<p id="text">内容</p>
通过ID选择器为带有id属性的html标签添加样式
#text{
font-size:30px;
}
ps：一个id只能对应一个html元素
群组选择器：
当有多个元素使用同一样式的时候，可以把选择器写在一起，用逗号隔开
h1,p,#text,.new1{font-size:50px;}
群组选择器可以减少代码量，改善css代码的结构，提高网页质量
全局选择器
当某些样式可以应用在全网页，可以用全局选择器（通常用于清除默认边距）
*{margin:0;padding:0;}
后代选择器
在网页中大量重复元素想给某一部分添加样式时使用,选择器之间使用空格
<style>
#menu li a{font-size:30px;}
</style>
<ul id="menu">
<li><a></a></li>
<li><a></a></li>
<li><a></a></li>
</ul>
<ul id="menu2">
<li><a></a></li>
<li><a></a></li>
<li><a></a></li>
</ul>
伪类
伪类用于向某些选择器添加特殊的效果，通常用于给链接添加交互效果
:link <!--未访问的链接-->
:visited <!--以访问的链接-->
:hover <!--鼠标悬停状态-->
:active <!--选中链接状态-->
<style>
a:link{color:blue;}
a:visited{color:#FF33FF;}
a:hover{color:red;}
a:active{color:green;}
</style>
ps：:hover与:active任何元素都可应用，
顺序：:link :visited>:hover>:active(:link与:visited前后顺序随意，:hover要在前两个后面，:active要在:hover后面)
css继承与层叠
继承：css子级元素会继承父级元素的某些样式属性
层叠：可以定义多个样式
不冲突时，多个样式可以层叠为一个
冲突时，按不同样式规则优先级来应用样式
css优先级规则
同一样式表中：
1.权值相同
就近原则（离被设置元素越近优先级越高）
2.权值不同
根据权值判断css样式，哪种css样式权值高，就使用哪种样式
选择器权值
标签选择器：1
类和伪类： 10
全局选择器：0
id选择器： 100
行内样式： 1000
权值规则
统计不同选择器的个数
每类选择器的个数乘以相应的权值
把所得的值相加就是选择器的权值
!important规则
可调整选择器的优先级
添加在样式规则之后，中间用空格隔开
css命名规则
采用英文字母、数字以及"-"和"_"命名
以小写字母开头，不能以数字及"-"和"_"开头
命名形式：单字，连字符，下划线和驼峰
使用有意义的命名
常用的css样式命名
1)页面结构
页头：header 导航：nav
页面主体：main 侧栏：sidebar
页尾：footer 栏目：column
内容：content/container 页面外围控制：wrapper
容器：contentainer 左右中：left right center
2)导航
导航：nav 左导航：leftsidebar
主导航：mainnav 右导航：rightsidebar
子导航：subnav 菜单：menu
顶导航：topnav 子菜单：submenu
边导航：sidebar 标题：tilte
摘要：summary
3)功能
标志：logo 注册：register
广告：banner 搜索：search
登录：login 功能区：shop
登录条：loginbar 标题：title
Id跟class应用
Id不要滥用，谨慎使用
适当使用class
