如何在CSS中定位锚点元素? [英] How do I center an anchor element in CSS?
问题描述
我只想在屏幕中间水平放置我的锚点,我该怎么办?
I just want to have my anchor in the middle of the screen horizontally, how might I do this?
<a href="http://www.example.com">example</a>
推荐答案
添加 text-align
Add the text-align
css property to its parent style attribute
例如
<div style="text-align:center">
<a href="http://www.example.com">example</a>
</div>
或使用类别(推荐)
<div class="my-class">
<a href="http://www.example.com">example</a>
</div>
b
$ b
.my-class {
text-align: center;
}
Q:为什么 text-align
样式不能应用于 a
div
?
Q: Why doesn't the text-align
style get applied to the a
element instead of the div
?
A: > text-align 样式描述 inline
如何在块
元素中对齐。在这种情况下, div
是一个块元素,它的内联内容是 a
。为了进一步探讨这一点,考虑当 text-align
样式应用于 a
A: The text-align
style describes how inline
content is aligned within a block
element. In this case the div
is an block element and it's inline content is the a
. To further explore this consider how little sense it would make to apply the text-align
style to the a
element when it is accompanied by more text
<div>
Plain text is inline content.
<a href="http://www.example.com" style="text-align: center">example</a>
<span>Spans are also inline content</span>
</div>
即使threre是换行符,这里的所有内容 div
是内联内容,因此会产生如下内容:
Even though threre are line breaks here all the contents of div
are inline content and therefore will produce something like:
纯文本是内联内容。 示例跨度也是内联内容
它如果 text-align
属性被应用,它将如何显示在这种情况下如何显示
It doesnt' make much sense as to how "example" in this case would be displayed if the text-align
property were to be applied it it.
这篇关于如何在CSS中定位锚点元素?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!