结果:
css:
<style type="text/css">
div, ul, ol {
margin: 0;
padding: 0;
}
.box {
position: relative;
overflow: hidden;
height: 488px;
}
li {
list-style: none;
cursor: pointer;
}
ol {
position: absolute;
left: 50%;
bottom: 0;
margin-left: -412px;
88px;
height: 42px;
}
ol li {
float: left;
44px;
height: 42px;
}
</style>
html:
<div class="box">
<ul>
<li><img src="images/banner_img01.jpg" alt="" /></li>
</ul>
<ol>
<li title="上一张"></li>
<li title="下一张"></li>
</ol>
</div>
原图: