Fatal编程技术网
  • html/
  • HTML跨距对齐中心不工作？

HTML跨距对齐中心不工作？

html css

HTML跨距对齐中心不工作？,html,css,Html,Css,我有一些HTML： <div align="center" style="border:1px solid red"> This is some text in a div element! </div> 这是div元素中的一些文本！ Div正在更改文档上的间距，因此我想使用一个span来代替 但span并没有集中内容： <span style="border:1px solid red;align=center"> This is some text

我有一些HTML：

<div align="center" style="border:1px solid red">
This is some text in a div element!
</div>


这是div元素中的一些文本！
Div正在更改文档上的间距，因此我想使用一个span来代替

但span并没有集中内容：

<span style="border:1px solid red;align=center">
This is some text in a div element!
</span>


这是div元素中的一些文本！
我该如何解决这个问题

编辑：

我的完整代码：

<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元素中的一些文本！
不推荐使用
align
属性。使用CSS
文本对齐
。此外，除非使用
display:block
或
display:inline block
并设置宽度值，否则跨度不会居中显示文本，但其行为与div（块元素）相同

你能发布一个布局的例子吗？使用www.jsfiddle.net

div是块元素，除非设置了宽度，否则它将跨越容器的宽度。span是一个内联元素，它的宽度与文本的宽度相同。当前，您正在尝试将align设置为CSS属性。对齐是一个属性

<span align="center" style="border:1px solid red;">
    This is some text in a div element!
</span>
请使用以下样式<代码>边距：自动通常用于将内容居中对齐<代码>显示：
span
元素需要表

<span style="margin:auto; display:table; border:1px solid red;">
    This is some text in a div element!
</span>


这是div元素中的一些文本！
Span是内联块，可根据内联文本大小进行调整，其坚韧性阻止了大多数努力摆脱内联上下文。要简化布局样式（限制冲突），请使用换行符将div添加到“p”标记中

<p> some default stuff
<br>
<div style="text-align: center;"> your entered stuff </div>

一些默认的东西


你输入的东西
只需使用
单词包装：打断单词。它可以工作。
span.login-text{

span.login-text {
    font-size: 22px;
    display:table;
    margin-left: auto;
    margin-right: auto;
}

<span class="login-text">Welcome To .....CMP</span>


字体大小：22px；
显示：表格；
左边距：自动；
右边距：自动；
}
欢迎来到……CMP



对我来说效果很好。在所有其他解释的基础上，我相信您使用的是等号，而不是冒号：“
”：
应该是：

<span style="border:1px solid red;text-align:center">
您的div正在“更改间距”？你这是什么意思？你的span不会，因为默认情况下它是一个内联元素，而div是一个块级元素。跨度不能做到这一点。请使用Firebug或Chrome inspector查看应用于元素的CSS规则，并查找添加填充或边距的规则。周围的元素也可能有填充/边距。
text align=center
应该是
text align:center
效果很好！谢谢。我不能在保持两个内联元素为内联元素的同时将它们以不同方式对齐吗？
display:block
。
内联块
根本不工作。耶，我找到了如何使它工作的方法。基本上，解决方案是反向的：不是将要居中的文本居中，而是将不想居中的文本左对齐@JeffCamera您介意为您的答案添加一个解决方案吗？第二种方法的问题是容器应该左对齐，然后容器中的一些文本应该居中。类似我尝试了不推荐的方法，因为这似乎是唯一的方法，但它在Chroimum和Firefox中都不起作用。 
<span style="border:1px solid red;text-align=center">

<span style="border:1px solid red;text-align:center">