如何排列HTML/CSS的 '一' 元素

HTML代碼一致的「a」元素：

<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <link href='http://fonts.googleapis.com/css?family=Cedarville+Cursive' rel='stylesheet' type='text/css'> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script type="text/javascript" src="script.js"></script> 
</head> 

<body> 

    <h1>Olive</h1> 
    <a href="page1.html">Enter</a> 

</body> 
</html>

CSS代碼：

body { 
background-color: olive; 
} 

h1 { 
font-family: 'Cedarville Cursive', cursive; 
font-size: 230px; 
text-align: center; 
} 

a { 
font-family: 'Cedarville Cursive', cursive; 
color: white; 
font-size: 100px; 
text-decoration: none;

}

我在CSS表單中的'a'元素中使用了'text-align'，但沒有改變。

來源

2013-03-15 Julián D' Alessandro

text-align:center;中心元素中的文本，當你把它應用到<a>，你爲中心的<a>它裏面裏面的文字，但<a>是一個內聯元素，它不舒展，所以你需要裏面放置一個div。

<div> <a> Ha </a> </div> 

div{ 
text-align:center; 
}

來源

2013-03-15 03:06:40

謝謝你的資料！ – 2013-03-15 03:15:14

這是因爲你不能text-align一個內聯元素，如a是默認的。試試這個：

a { 
    display: block; 
    text-align: center; 
    /* ... */ 
}

來源

2013-03-15 03:04:56

它的工作！非常感謝！ – 2013-03-15 03:06:12

您不應該將內聯元素轉換爲阻止對齊。使用文本對齊來對齊內聯子元素（a）和浮點以對齊塊子元素（h1）！ – 2013-03-15 03:08:23

你需要在parent（body）上使用text-align。這對齊了內聯兒童。

來源

2013-03-15 03:06:15

因爲它是內聯元素，所以元素應該總是嵌套在塊元素中，而不管任何樣式問題。

例如爲：

<p> 
    <a><a href="page1.html">Enter</a> 
</p>

這樣一來，你就可以使用類似下面的CSS規則：

p > a { text-align: center; }

來源

2013-03-15 04:42:36

如何排列HTML/CSS的 '一' 元素

回答

相關問題