css这样：.blank{clear:bothoverflow:hiddendisplay:blockoverflow:hidden}
不遮盖它下面的内容，你说的是这样的效果吗
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
</head>
<style type="text/css">
* {
margin: 0
padding: 0
-webkit-user-select: none
-moz-user-select: none
-ms-user-select: none
user-select: none
}
li {
list-style: none
}
.box {
height: 50px
}
.box ul {}
.box ul li {
float: left
background: #3695D5
width: 50px
height: 35px
line-height: 35px
text-align: center
box-shadow: 3px 5px 16px 3px #000000
/*阴影左右平移,上下平移,模糊距离,阴影尺寸,阴影颜色*/
margin: 10px
cursor: pointer
}
.box ul li:active {
box-shadow: 3px 5px 16px 3px #000000 inset
}
.demo {
border: 1px solid #000000
width: 350px
height: 150px
}
</style>
<body>
<div class="box">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
<div class="demo">
</div>
</body>
</html>
css避免绝对定位覆盖其他元素，首先，在做定位的时候，确实是会出现覆盖的问题，一般在确定left，top，bottom，right这些数值，一般都是精确的测量过，很少出现覆盖，有问题的，通过JS获取到这个块的left，top，bottom，right,动态的来控制，能避免出现这些问题，具体看代码：<html>
<head>
<style>
#div1{
width:460px
height:200px
position:absolute
}
</style>
</head>
<script>
var oDiv = document.getElementById('div1')
var Let = Div.style.left //上下的值，
var Rig = Div.style.top
</script>
<body>
<div id='div1'>
<p>我是测试文字</p>
</div>
</body>
</html>
