jquery - 如何使用CSS在中间对齐文本？

Question

我想将我的 to 标记居中对齐:

|     anchor1       |      anchor2       |

现在这是我的 jquery:

<div id="main">
    <a id="fancybox-manual-c" href="javascript:void(0);">anchor1</a>
    <a class="watchvideo_new" href="javascript:void(0);">anchor2</a>
</div>

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script>
    $(function () {
        $("#main").css({
            "border-color": "black",
            "border-width": "1px",
            "border-style": "solid"
        });

        $("#main").width(340);

        $("#fancybox-manual-c").width(185);

        $(".watchvideo_new").width(185);
        $(".watchvideo_new").css('background', 'white');
    }
        );

</script>

Answer 1

a{
  text-align: center;
  display: inline-block;
  min-width: 100px;
}

类似上面的东西应该可以工作。

a 元素的默认display 是inline，因此您需要更改它才能设置宽度。

关于 display:inline-block 的一件事是您通常还会获得额外的 4px，这是因为它将元素之间的空间计为实际空间。