CSS(day05)

1.显示方式
1.决定元素在页面中 表现形式,块级，行内,行内块，table
display: inline 让元素显示为行内
block 让元素显示为块级
inline-block 让元素显示为行内块
table 让元素按table的方式显示
none 让文本脱离文档流隐藏

2.显示效果
visibility: 默认值 visible 可见的 、hidden隐藏
visibility: hidden 和 dispaly:none的区别
visibility:hidden; 不脱离文档流 占着位置隐藏
display:none; 脱离文档流不占位置隐藏

3.透明度
opacity: 0~1
1不透明、0全透明
rgba() 与 opacity区别
rgba() 只会改变当前的透明度
(缺)

4.光标的设置
cursor: 箭头default
小手 pointer
文本 text
等待 wait
帮助 help
十字 crosshair

5.垂直对齐方式
1.table/td/th 中使用
vertical-algin: top/middle/bottom

2.img中使用 设置img前后的行内元素(行内块)与img的垂直对齐方式
vertical-align: 默认值 baseline 基线
top/middle/bottom

6.列表的样式
list-style-type: none;(去点)
list-style-image:url();
list-style-position:默认值outside 选项在ul的内边距中
inside 选择在ul的内容区域中
list-style:type/url position
通常项目中，list-syle:none 去点

十二、定位（相对、绝对、固定）
position:
取值:static 默认 静态(默认文档流)
relative相对定位
absolute绝对定位
fixed 固定定位
注意:当一个元素被position:relative/absolute/fixed修饰
①这个元素解锁偏移属性
top/right/bottom/left
②这个元素被称为 已定位元素

1.相对定位
position:relative;配合偏移属性使用
top: + ↓
left:+→
right:+ ←
bottom:+ ↑
特点：

1.相对定位不脱离文档流
2.如果相对定位没有偏移属性,或者偏移量为0,结果跟没有做定位的结果一致
3.相对谁定位,相对自己原来的位置偏移

偏移属性的特点:
上下冲突以top为准 左右冲突以left为准

使用场合:
1.自身元素的位置的微调(类似于margin)
2.作为绝对定位元素的,已定位祖先元素

---

2.绝对定位
position：absolute 配合偏移属性
绝对定位脱离文档流

绝对定位相对谁定位???
1.没有祖先级,已定位元素,相对body左上角定位
2.绝对定位会相对于离自己"最近的" “已定位” "祖先级"元素的左上角取偏移

3.固定定位
position：fixed; 配合偏移量
将元素固定在页面上的某个位置,不会随滚动条发生滚动,
一直固定在可视区域,永远相对body进行偏移

4.堆叠顺序
只能设置在已定位元素上
z-index:正整数
默认情况 后写写元素堆叠顺序高，但是值不大于1
一般情况下1000以内就够用
定位的脱离文档流和浮动的脱离文档流不是一个体系
堆叠顺序对父子关系无效,儿子永远在父亲上面