本周主要更甚一步的了解css不同属性的更深一步的用法
1.float属性
① 3个属性值
- left
- right
- none
②清除浮动影响
有两种方法
- clear:both/right/left
- width:100%;overflow:hidden;
position属性
1.三种定位方式
- 静态定位
- 相对定位
- 绝对定位
2.四个属性值
- static (静态定位)
- relative (相对定位)
- absolute (绝对定位)
- fixed (固定定位)
fixed和absolute同属于绝对定位
深入理解border属性
1.border-style类型
- solid 实线
- dashed 虚线
虚线在IE浏览器中长宽比为2:1所以看起来比较密
在chorme和firefox中为3:1看起来比较稀疏 dotted 点线
chorme/firefox中为方形
IE中为圆所以可以利用这一特性实现圆角
.box{
width:150px;
height:150px;
overflow:hidden;
}
.dotted{
width:100%;
height:100%;
border:149px dotted ;
}
double 双线(兼容性好)
- inset 内凸(兼容性很差)
- outset 外凸(兼容性很差)
- groove 沟槽 (兼容性很差)