2015-06-19 75 views
2

我試圖將一個<a>標籤的按鈕居中。但是,唯一可行的是<center>標籤。我試過使用<a style="text-align: center">Button</a><a align="center">Button</a>,但兩者都沒有工作。爲什麼只有中心標籤有效?中心標籤適用於鏈接,但不適用CSS或對齊屬性

我的CSS是這樣的:

.btn { 
    color: white; 
    background-color: orange; 
    padding: 5px; 
    border-radius: 10px; 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    text-decoration: none; 
    transition: 200ms all; 
} 

.btn:hover { 
    background-color: #FFC964; 
    color: white; 
    cursor: pointer; 
} 

HTML:

<a href="http://example.com" class="btn">Button</a> 
+0

請張貼您的HTML! –

+0

即使問題得到解答,我也會爲其他可能會覺得有幫助的人添加HTML。 – user3777369

回答

2

<center>標記已被棄用,並且很可能在所有瀏覽器中被刪除。和<a>標籤是內聯性的,所以text-align: center應給予它的父塊元件:

.make-center {text-align: center;}
<div class="make-center"> 
 
    <a href="#">I am a link</a> 
 
</div>

在上面的代碼中,<div class="make-center">標籤充當<center>標籤。

+0

謝謝!這對我有效。我想我忘了父元素必須使用它,而不是內聯元素。 – user3777369

+0

當然,錯誤發生在哥們! –

+1

另外,無論如何我都不會使用'''

'''標籤。那件事是邪惡的。我懷疑它會在所有的瀏覽器中被刪除,因爲舊的網站可能會依賴它。 – user3777369

0

a元素有.btn類?

嘗試加入這個CSS它:

display:block; 
margin:0 auto; 

否則,創建我們的jsfiddle其再現了這個問題。你沒有顯示你的整個CSS和標記。

+0

是的,我的'''''''元素確實有它。 – user3777369

相關問題