<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0pxpadding:0px}
ul{width:1212pxheight:40pxmargin:60px auto}
ul li{width:200pxheight:40pxbackground:#eeeborder:1px solid redfloat:leftlist-style-type:noneposition:relative
/*修正1*/
z-index:3}
.content{width:1212pxposition:absoluteheight:600pxbackground:#eeetop:40pxleft:-200px
/*修正2*/
z-index:1}
/*修正3*/
.active{z-index:2}
</style>
</head>
<body>
<ul>
<li></li>
<!-- 修正4 -->
<li class = "active"><div class="content"></div></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
可以用position:fixedbottom:0z-index:999试试看能不能达到你想要的效果。如果达不到可能我理解错了,可以追问。
希望可以帮到你!
内容 content :盒子的主要区域,盒子中的文本内容以及后代元素都显示在内容区域中。
内边距 padding :内容与盒子边界的距离。
边框 border :边框显示在盒子的边界上。
外边距 margin :盒子和相邻兄弟元素或父元素的距离。
盒子的大小=内容的大小+内边距的大小+边框的大小
元素默认 总宽度 = 父元素内容的宽度 - 元素自己的左右外边距
元素默认 内容宽度 = 父元素内容的宽度 - 元素自己的左右外边距 - 元素自己的左右边框宽度 - 元素自己的左右内边距