Question

我尝试在CSS中使用text-align但它不起作用。这里是CSS，我也将所有的身体设置为中心，这与某些事情有关吗？这是我的CSS：

#Swell {
	text-align: left;
}

这是我的HTML：

<a id="Swell" href="https://www.swell.com">Use Swell Bottles<img src="https://s-media-cache-ak0.pinimg.com/originals/f9/93/95/f99395b48463ee8d3bfa16f32df51c98.jpg" height="50"></a>

我的CSS正文text-align：

body {
font-family: sans-serif;
text-align: center; 
background-color: rgb(128, 212, 255);
}

使用text-align：center来处理错误，如果是，那么如何覆盖/修复此错误

Answer 1

锚元素<a>是默认情况下的内联元素。这意味着它本身没有宽度或高度，而是与其内容一样大。

text-align属性在您的示例中有效。只是文本与其容器对齐。在这种情况下，它与其内容完全一样大。因此，您不会看到任何差异。

尝试将anchor元素的display属性设置为阻止，看看会发生什么。

＆＃13;

a{
display:block;
text-align:right;
}

＆＃13;

<a>Blocking beautiful</a>

＆＃13;

编辑：更符合您的示例：

＆＃13;

body{
text-align:center;
}

a{
display:block;
text-align:left;
}

＆＃13;

<body>
<a>Still beautiful</a>
<span>centered</span>
</body>

＆＃13;

Answer 2

HTML

<div id="parentdiv">
    <a id="Swell" href="https://www.swell.com">Use Swell Bottles<img src="https://s-media-cache-ak0.pinimg.com/originals/f9/93/95/f99395b48463ee8d3bfa16f32df51c98.jpg" height="50"></a>
</div>

CSS

body {
font-family: sans-serif;
text-align: center; 
background-color: rgb(128, 212, 255);
}

#parentdiv {
    text-align: left;
}

实施例

＆＃13;

<html>
<style>
body {
font-family: sans-serif;
text-align: center; 
background-color: rgb(128, 212, 255);
}
    
#parentdiv {
text-align: left;
}
</style>
<div id="parentdiv">
<a id="Swell" href="https://www.swell.com">Use Swell Bottles<img src="https://s-media-cache-ak0.pinimg.com/originals/f9/93/95/f99395b48463ee8d3bfa16f32df51c98.jpg" height="50"></a>
</div> 
</html>

＆＃13;

CSS text-align不起作用

2 个答案: