0

我需要在中心对齐一个“a”元素

HTML 代码：

<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”，但它没有改变。

4

4 回答 4

3

text-align:center;将文本居中放置在元素内，当您将其应用于 时<a>，您会将文本居中<a>放置在其中，但它<a>是内联元素，它不会拉伸，因此您需要将其放置在div.

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

div{
text-align:center;
}
于 2013-03-15T03:06:40.270 回答
2

那是因为您不能像默认情况下text-align那样使用内联元素。a试试这个：

a {
    display: block;
    text-align: center;
    /* ... */
}
于 2013-03-15T03:04:56.010 回答
1

您需要在父级（正文）上使用 text-align 。这将对齐内联子级。

于 2013-03-15T03:06:15.267 回答
0

因为它是一个内联元素，一个元素应该总是嵌套在一个块元素中，不管任何样式问题。

例如：

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

这样，您就可以使用类似于以下 CSS 规则的内容：

p > a { text-align: center; }
于 2013-03-15T04:42:36.517 回答