HTML跨度alignment中心不工作?
我有一些HTML:
<div align="center" style="border:1px solid red"> This is some text in a div element! </div>
Div正在改变我的文档的间距,所以我想用一个跨度来代替。
但跨度并不集中内容:
<span style="border:1px solid red;align=center"> This is some text in a div element! </span>
我该如何解决?
编辑:
我的完整代码:
<html> <body> <p>This is a paragraph. This text has no alignment specified.</p> <span style="border:1px solid red;text-align=center"> This is some text in a div element! </span> </body> </html>
一个div是一个块元素,并将跨越容器的宽度,除非设置了宽度。 span是一个内联元素,并且将具有其中的文本的宽度。 目前,您正尝试将alignment设置为CSS属性。 alignment是一个属性。
<span align="center" style="border:1px solid red;"> This is some text in a div element! </span>
但是,align属性已被弃用。 您应该使用容器上的CSS text-align
属性。
<div style="text-align: center;"> <span style="border:1px solid red;"> This is some text in a div element! </span> </div>
请使用以下样式。 margin:auto
通常用于居中alignment内容。 display:table
span
元素需要display:table
<span style="margin:auto; display:table; border:1px solid red;"> This is some text in a div element! </span>
align
属性已被弃用。 使用CSS text-align
。 另外,除非使用display:block
或display:inline-block
并为宽度设置一个值,否则跨度不会居中,但是它的行为与div(块元素)相同。
你可以发布你的布局的例子吗? 使用www.jsfiddle.net
span.login-text { font-size: 22px; display:table; margin-left: auto; margin-right: auto;
}
<span class="login-text">Welcome To .....CMP</span>
对我来说,它工作得很好。 也试试这个
跨度是内联块,并调整为内联文本大小,具有坚韧性,可以阻止大多数内联上下文的工作。 为了简化布局风格(限制冲突),用换行符将div添加到“p”标签。
<p> some default stuff <br> <div style="text-align: center;"> your entered stuff </div>
除了所有其他解释之外,我相信你使用的是相同的"="
符号,而不是冒号":"
:
<span style="border:1px solid red;text-align=center">
它应该是:
<span style="border:1px solid red;text-align:center">
只要使用word-wrap:break-word;
在CSS中。 有用。