css - 如何相对于链接之间的空间逐步增强内联 block 分页链接

Question

我正在使用 will_paginate , 并且它产生的分页链接如下:

<a href="?page=2">2</a> <a href="?page=3">3</a>

页面链接之间有空格。这是有道理的。正如它在文档中所说，它在基于文本的浏览器和蜘蛛程序中运行良好(尽管从直觉上，我不明白为什么后者会是这种情况)。太棒了。

我想将链接作为一个组居中。实现此目的的唯一方法(我知道)是使它们成为内联元素并为其父元素提供 text-align: center;。

但我也想更好地控制元素之间的空间。

总而言之，这是我的可有可无:

• 链接之间的空格
• 链接共同居中
• 对链接之间的间距进行微调(像素级)控制

我可以想到几种方法来实现这一点:

• 将分页链接重构为无序列表，这样非图形浏览器至少会独立于它们之间的空格来呈现链接之间的区别
• 将父元素设置为 font-size: 0px; 然后显式声明各个链接的字体大小

这对我来说都不太理想。第一个需要大量无关的标记，在我看来它在语义上很差。第二个似乎有点老套。

是否有任何解决方案可以更好地真正满足我的需求而没有任何额外问题？也许像 CSS 指令那样忽略空格或其他东西。

Answer 1

如何在链接上使用 float 并将它们 float 在一个然后居中对齐的框中:

http://jsfiddle.net/AnN9n/1/