-
绝对定位配合margin实现精确定位查看全部
-
解决IE7浏览器绝对定位永远inline-block水平的bug只需要在其外面套一层block表标签即可查看全部
-
折翼天使实例查看全部
-
脱离文档流表现查看全部
-
定位的行为表现有二 脱离文档流，折翼的天使 注意float的属性：包裹性与破坏性，但没有脱离文档流查看全部
-
无依赖的绝对定位查看全部
-
absolute超越overflow限制查看全部
-
clear用来管控float带来的破坏性，relative用来管控absolute查看全部
-
差异所在-拉伸更强大，第一种拉伸的ie7+浏览器支持；第二种设置width的只有现代浏览器支持查看全部
-
absolute的翅膀拉伸和width、height是可以相互代替的查看全部
-
left/top/right/bottom与width/height： 1.具有相互替代性 例：实现一个全屏自适应的50%黑色半透明遮罩层。 二种实现方式： 1.overlay{ position: absolute; width:100%;height:100%; left:0;top:0; } 2.overlay{ position:absolute; left:0;top:0;right:0;bottom:0; }查看全部
-
动画尽量作用在绝对定位元素上查看全部
-
z-index无依赖 1.如果只有一个绝对定位元素，自然不需要z-index,自动覆盖普通元素； 2.如果两个绝对定位，控制DOM流的前后顺序达到需要的覆盖效果，依然无z-index； 3.如果多个绝对定位交错，非常非常少见，z-index:1控制； 4.如果非弹窗类的绝对定位元素z-index>2,必定z-index冗余，请优化！查看全部
-
【CSS】【处理对齐、溢出技巧】 1.处理文字前的星号 将星号绝对定位后其不占据任何空间，方便后面的文字左对齐 <label class="regist-label"><span class="regist-star">*</span>登录密码</label> .regist-star { position: absolute; margin-left: -1em; font-family: simsun; color: #f30; } 2.图片与文字垂直对齐 对图标设置绝对定位，并设置margin为负值 <span class="regist-remark regist-warn"> <i class="icon-warn"></i>邮箱格式不准确（演示） </span> .regist-warn { padding-left: 20px; color: #be3948; } .regist-warn > .icon-warn { position: absolute; margin-left: -20px; } 3.处理文字溢出 利用absolute绝对定位使span不占据任何空间，从而使其不换行（注<span>必须紧跟前一个标签，不能有空格） <span class="regist-remark">请输入6-16位密码，区分大小写，不能使用空格</span> .regist-remark { position: absolute; line-height: 21px; padding-top: 9px; color: #666; }查看全部
-
position：absolute的表现： 1，去浮动，绝对定位实现的时候，浮动是无效的；比如说：图片浮动后绝对定位和直接绝对定位的位置是一样的； 2，位置跟随：原先是block水平，那absolute后依旧是换行显示的，原先是inline或者inline-block，那么还是在原位置；特例：在IE7浏览器下，任何元素绝对定位都是inline-block化的查看全部
举报
0/150
提交
取消