网页设计中翻页代码居中的问题

　　我最近用 JS 写特效比较多，所以看到这个问题，我第一感觉就是用 JS 方式实现，思路是：

　　先给翻页代码的父级元素一个居中样式：margin: 0 auto;

　　然后使用 JS 去动态获取翻页代码内所有元素的宽度，再把这个宽给父级，实现居中。

　　用这个思路实现了以后，感觉有点不妥，应该有更简单的解决方法才对，后来跟一位在酷6上班的朋友说起这个效果，

　　她说用CSS实现很简单呀，不需要用JS的，她的代码如下：

　　XHTML部分：

<div id=”page”>  <a href=”#”>上一页</a>  <a href=”#”>1</a>  <a href=”#”>2</a>    <a href=”#”>3</a>  <a href=”#”>下一页</a> </div>

　　CSS部分：

#page{ text-align:center; height:30px; line-height:30px; } a { padding: 3px 5px; font-family: Arial; font-size: 14px; color: #333; background: #eee; border: 1px solid #ccc; margin-right: 2px; text-decoration: none; } a:hover { background: red; color: #fff; border: 1px solid #000;}

评论总数：0 条 [ 查看全部 ] 网友评论