css3中的邊框文字

我很好奇。這更多的是樂趣和技巧，但是你知道我是否可以處理財產以將文本置於中間。css3中的邊框文字

我對JS斌郵編（刷新如果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或:before這是不可能的。

來源

2012-05-19 benoît

難道你不能在<a>內添加另一個標籤嗎？如果是這樣，你可以絕對定位這個內部標籤來實現：http://jsbin.com/3/uhumok/6/edit?html,css,live。

來源

2012-05-19 14:47:09 bfavaretto

如果您製作顏色：＃000並添加填充頂部：50px至：懸停，文本將幾乎保持在同一位置。我沒有保存該示例，因爲我沒有看到保存選項。如果你使用過：之前/之後的文本將絕對定位，所以idk爲什麼你不想使用它們;

來源

2012-05-19 14:48:57 albert

css3中的邊框文字

回答

相關問題