如何排列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的 '一' 元素

回答

相关问题