问答详情
源自:4-7 编程练习

代码代码代码

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>页码的制作</title>
<style>
/*在此定义相关CSS样式*/
.top{ width:295px; height:30px; border:1px solid #ccc; }
.top .to{ font-size:12px; border:1px solid #ccc;display:block; width:40px; height:20px;line-height:20px;text-align:center;float:left;margin:4px 5px;}
.top .tol{ font-size:12px; border:1px solid #ccc;display:block; width:20px; height:20px;line-height:20px;text-align:center;float:left;margin:4px 5px;}
.top .tol{ font-size:12px; border:1px solid #ccc;display:block; width:20px; height:20px;line-height:20px;text-align:center;float:left;margin:4px 5px;}
.top .tol p{ margin:0px; background:red;}
</style>
</head>

<body>
<!--在此制作页码的基本结构-->
<div class="top">
 <span class="to">首页</span>
 <span class="tol"><</span>
 <span class="tol"><p>1</p></span>
 <span class="tol">2</span>
 <span class="tol">3</span>
 <span class="tol">....</span>
 <span class="tol">></span>
 <span class="to">末页</span>
</div>


</body>
</html>


提问者:Tenderness的家 2015-06-04 17:11

个回答

  • 正是泽
    2015-12-25 17:44:51

    不要用display:block;用display:inline-block;就会在同一行了