margin的相关属性及应用
1、margin常见问题:
①IE6下双边距 (不推荐使用float+margin,可用padding替代)
详见《css浏览器兼容问题集锦》之4、IE6中margin双边距
②IE6绝对定位margin-left的问题 (不推荐使用absolute布局)
详见《css浏览器兼容问题集锦》之3、IE6中绝对定位left的div,与其他div的margin-left问题
2、在流动性布局当中的应用
详见《网页布局的应用(float或absolute)》 (不推荐使用absolute布局)
3、在选项卡等边线的处理
.nav li { float: left; padding: 5px 20px; border: 1px solid #dcdcdc; margin-right: -1px; } .nav li.hover { border-bottom: none; }
<div class="fz"> <ul class="nav"> <li>首页</li> <li class="hover">技术</li> <li>生活</li> <li>作品</li> </ul> </div>
或者margin-left:-1px;让之间的边框重叠。上下排列使用margin-top或者margin-bottom。
4、图片与文字对齐
当图片较小16或者20像素的时候设置img的属性
vertical-align:middle;
vertical-align:text-bottom;
margin:0 3px -3px 0;
总结:具体根据实际情况