CSS文本对齐不起作用 [英] CSS text-align does not work

查看:87
本文介绍了CSS文本对齐不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图在CSS中使用文本对齐,但它不起作用。
在这里是CSS,我也有所有的机构设置为中心,这是否与某些事情有关?
这是我的CSS:





这是我的HTML:



< a id =Swellhref =https://www.swell。 COM >使用溶胀瓶与LT; IMG SRC = https://s-media-cache-ak0.pinimg.com/originals/f9/93/95/f99395b48463ee8d3bfa16f32df51c98.jpg HEIGHT = 50 >< / a>



另外我的CSS正文text-align:



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

剂量text-align:center与错误有关,如果是,那么我该如何覆盖/修复这个错误

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



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



尝试设置anchor元素的display属性以阻止并查看发生了什么。



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

 

编辑:更符合你的例子: data-hide =falsedata-console =truedata-babel =false>

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

< body>< a>依然美丽< / a>< span>居中< / s pan>< / body>

I tried to use the text-align in CSS but it does not work. here is the CSS and I also had all the body set to center, does that have to do with something? Here is my CSS:

#Swell {
	text-align: left;
}

Here is my 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>

Also my CSS body text-align:

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

Dose the text-align: center have to do with the error and if that is true then how do I overwrite/fix this error

解决方案

An anchor element <a> is an inline element per default. Meaning it has no width or height on its own but rather is exactly as big as its content.

The text-align property does work in your example. It's just that the text is aligned regarding it's container. Which in this case is exactly as big as it's content. Therefore you would not see any difference.

Try to set the display property of the anchor element to block and see what happens.

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

<a>Blocking beautiful</a>

Edit: More in line with your example:

body{
text-align:center;
}

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

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

这篇关于CSS文本对齐不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆