首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在html/css中对齐'a‘元素

如何在html/css中对齐'a‘元素
EN

Stack Overflow用户
提问于 2013-03-15 11:00:51
回答 4查看 155关注 0票数 0

我需要在中间对齐一个"a“元素。

HTML代码:

代码语言:javascript
复制
<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代码:

代码语言:javascript
复制
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’,但它没有改变。

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2013-03-15 11:06:40

text-align:center;将元素中的文本居中,当您将其应用于<a>时,您是将文本放在<a>中的元素中,但是<a>是一个内联元素,它不会拉伸,所以您需要将它放在div中。

代码语言:javascript
复制
<div> <a> Ha </a> </div>

div{
text-align:center;
}
票数 3
EN

Stack Overflow用户

发布于 2013-03-15 11:04:56

这是因为您不能对内联元素执行text-align操作,就像默认情况下使用a一样。试试这个:

代码语言:javascript
复制
a {
    display: block;
    text-align: center;
    /* ... */
}
票数 2
EN

Stack Overflow用户

发布于 2013-03-15 11:06:15

你需要在正文父元素()上使用文本对齐。这会对齐内联子元素。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15423943

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档