0

我很好奇。它更多的是为了乐趣和提示，但你知道我是否可以处理一个属性来将文本定位在中间。

我在 JS bin 上有帖子代码（如果 CSS 未打开则刷新）：http: //jsbin.com/3/uhumok/edit ?html,css,live

HTML：

<a class="one" href="#">Hi !</a>

CSS：

a {
    display:block;
    color:white;
    text-decoration:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box; 
    width:100px;
    height:100px;
    text-align:center;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50px;

    border-width:50px;
    border-color:rgba(0,0,0,1);

    -webkit-transition:0.2s ease;
    -moz-transition:0.2s ease;
    -ms-transition:0.2s ease;
    -o-transition:0.2s ease;
    transition:0.2s ease;
}

a:hover {
    border-width:0;
    border-color:rgba(0,0,0,0.5);

    -webkit-transition-duration:0.5s;
    -moz-transition-duration:0.5s;
    -ms-transition-duration:0.5s;
    -o-transition-duration:0.5s;
    transition-duration:0.5s;
}

a.one {border-style:solid;}

:after我认为如果没有or ，这是不可能的:before。

4

2 回答 2

0

你不能在里面添加另一个标签<a>吗？如果是这样，您可以绝对定位这个内部标签来实现：http: //jsbin.com/3/uhumok/6/edit ?html,css,live 。

于 2012-05-19T14:47:09.910 回答
0

如果您将颜色设置为：#000 并将 padding-top:50px 添加到 :hover，文本将几乎保持在同一个位置。我没有保存示例，因为我没有看到保存选项。如果您使用 :before/:after 文本将被绝对定位，那么我知道为什么您不想使用它们；

于 2012-05-19T14:48:57.273 回答