昨天保存的草稿不见了,今天早上重新记录昨天的学习内容。昨天学习的内容不多,主要分为两大块:浮动和定位。
1、浮动的定义:使元素脱离原来的文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停下来。
float:left | right | none | inherit
清楚浮动————clear:left | right | both | none | inherit (both代表左右两侧均不允许有浮动元素)
2、目前兼容性比较好的清除浮动的方法:运用after伪类,在父级加上
.clearfix{ *zoom:1; }
.clearfix:after{ content:""; display:block; clear:both; }
3、当父级的盒子小于子级的盒子时,子级的盒子会显示溢出,解决办法是在父级加上overflow:hidden;超出的部分会被隐藏,如何加上overflow:scroll;就会在父级盒子的边上加上滚动条。
4、position:relative;相对定位:不会使元素脱离文档流,也就是说元素移动之后的原始位置会被保留。
top | bottom | left | right 定义元素的偏移位置。
5、position;absolute;绝对定位:使元素完全脱离文档流,如果有定位父级则相对于父级发生偏移,没有定位父级则相对于document发生偏移。
6、position:fixed;固定定位,始终相对于整个文档定位,IE6不支持固定定位。
7、层级默认后者高于前者,可以使用z-index:[number]定义各个元素层级。
8、透明度opacity:[0到1];0为全透明,1为不透明。