您的位置：首页 > 其它

(⊙_⊙)【负值】负边距+定位：水平垂直居中，去除列表右边距，去除列表最后一个li元素的border-bottom

2012-08-09 15:25 106 查看
负值之美：负值在页面布局中的应用 http://www.topcss.org/?p=94 


<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<style type="text/css">
*{margin:0;padding:0}
body{height:4000px;color:#000;font:12px/1.5 arial}
ul{list-style:none}

.box1{position:absolute;top:50%;left:50%;margin-top:-100px;margin-left:-100px;width:200px;height:200px;background:#f00}

.box2{width:320px;overflow:hidden;border:1px solid #000}
.box2 ul{float:left;margin-right:-10px;margin-bottom:-10px}
.box2 li{float:left;width:100px;height:100px;margin:0 10px 10px 0;background:#f00}

.box3{width:200px;border:1px solid #000}
.box3 li{height:20px;margin-bottom:-1px;border-bottom:1px solid #000}
</style>
<div class="box1"></div>
<div class="box2">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<ul class="box3">
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航