css学什么??
主要学习选择器和属性，选择器是去找到标签的位置，属性是给标签增加需要的样式。
CSS选择器
1.基本选择器：
1.标签选择器
2.ID选择器
3.类选择器(class="c1 c2 ...")
2.通用选择器(*)
3.组合选择器
1.后代选择器(空格)
2.儿子选择器(>)
3.毗邻选择器(div+p) 用的时候感觉有点问题
4.弟弟选择器 （~）
4.属性选择器
1.[s9]
2.[s9="hao"]
3.其他不常用的
5.分组和嵌套
1.分组(用逗号分隔的多个选择器条件)
2.嵌套(选择器都可以组合起来使用)
6.选择器的优先级
1.选择器相同，越靠近标签的优先级越高(就近原则)
2.权重的计算
1.内联样式1000
2.ID选择器100
3.类选择器10
4.元素选择器1
伪类和伪元素
1.伪类
1. : link
2. : visited
3. : hover(重要)
4. ：active
5. ：focus（input标签获取光标焦点）
2.伪元素
1. ：first-letter
2. ：before（重要 在内部前面添加）
3. ：after（重要 在内部后面添加）
css属性
1.字体
1.font-family
2.font-size
3.font-weight
2.文本属性
1.text-align 对齐(重要)
2.text-decoration 装饰（去除a标签的下划线）
3.text-indent 行首缩进
3.背景属性
1.background-color 背景颜色
2.background-image 背景图片
4.color
1.red (直接写颜色)
2.#FF0000
3.rgb(255,0,0) --> rgba(255,0,0,0.5)
5.边框属性border
1.border-width （边框宽度）
2.border-style（边框样式）
3.border-color （边框颜色）
一般情况都用简写：border：1px solid red;
css盒子模型
1.content （内容）
2.padding（内填充）调整内容和边框之间距离时使用这个属性
3.border（边框）
4.margin（外边框）多用于调整标签之间的距离
注意：要习惯看浏览器console窗口那个模型
display （标签的展现形式）
1. inline
2.block 菜单里面的a标签可以设置成block
3.inline-block
4.none （不让标签显示，不占位）
float（浮动）
1. 多用于实现布局效果（1.顶部的导航条，2.页面左右分栏）
2.float：任何标签都可以浮动，浮动之后都会变成块级 （a标签float之后就可以设置高和宽）
3.float取值
1. left
2.right
3.none
clear 清除浮动 >>> 清除浮动的副作用 （内容飞出，父标签撑不起来）
1.结合伪元素来实现
.clearfix：after {
content：“”；
display：“block”；
clear：both；
}
2.clear取值 >>> left right both
overflow
1.标签的内容放不下(溢出)
2.取值：
1.hidden ----> 隐藏
2.scroll -----> 出现滚动条
3.auto
4.scroll-x
5.scroll-y
定位 position
1.static(默认)
2.relative(相对定位 --> 相当于原来的位置)
3.absolute(绝对定位 --> 相当对于定位过的前辈标签)
4.fixed （固定 ---> 返回顶部按钮示例）
脱离文档流的3种方式
float
absolute
fixed
opacity(不透明度)
1.取值0~1
2.和rgba()的区别：
1.opacity改变元素子元素的透明度效果
2.rgba()只改变背景颜色的透明效果
z-index
1.数值越大，越靠近你
2.只能作用于定位过的元素
3.自定义的模态框示例