定位


定位

定位的思考

相对定位的特征

position:relative;

  • 不影响元素本身的特性
  • 不使元素脱离文档流(元素移动之后原始位置被保留)
  • 如果没有定位偏移量,对元素本身没有任何影响
  • 提升层级

绝对定位的特征

position:absolute;

  • 使元素完全脱离文档流
  • 使内联元素支持宽高
  • 块属性标签内容撑开宽度
  • 如果有定位父级相对于定位父级发生偏移,没有定位父级相对于document发生偏移
  • 相对定位一般都是配合绝对定位使用
  • 提升层级

z-index:[number] 定位层级

固定定位

与绝对定位的特性基本一致,但差别是始终相对于整个文档进行定位

问题; IE6不支持固定定位

定位其它值

  • static 默认值
  • inherit 从父元素继承定位属性的值(不兼容)

定位清浮动

position:absolute;绝对定位子元素子级的浮动可以不用写清浮动的方法

position:fixed; 固定定位元素子级的浮动可以不用写清浮动的方法

遮罩弹窗(优酷弹窗)

标准 不透明度 : opacity: 0~1;

IE滤镜: filter: alpha(opacity=0~100);


文章作者: dlwin888
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 dlwin888 !
 上一篇
表格 表格
表格表格的组成table表格 thead表格头 tbody表格主体 tr 表格行 th 元素定义表头 td 元素定义表格单元 表格样式重置table{border-collapse:collapse;} 单元格间隙合并 th,td {pad
2022-09-20
下一篇 
浮动 浮动
浮动介绍及基本语法float: left right none inherit 文档流是文档中可显示对象在排列时所占用的位置 浮动的定义使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来 浮动清除clear:
2022-09-13