我不明白这一点：
我试图将 HTML<span>标签的文本对齐居中，但它什么也没做……有了<div>标签，一切正常。与margin: 0px auto;css 中的设置相同的情况。
为什么 span 标签不支持该text-align;功能？
问问题
103034 次
6 回答
117
区别不在于<span>和<div>具体之间，而在于inline和block元素之间。<span>默认为 beingdisplay:inline;而<div>默认为 being display:block;。但是这些可以在 CSS 中被覆盖。
两者之间工作方式的差异在于text-align:center宽度。
block元素默认为其容器的宽度。它可以使用 CSS 设置其宽度，但无论哪种方式，它都是固定宽度。
元素的inline宽度取自其内容文本的大小。
text-align:center告诉文本将自己定位在元素的中心。但是在一个inline元素中，这显然不会产生任何影响，因为元素与文本的宽度相同；以一种或另一种方式对齐它是没有意义的。
在一个block元素中，因为元素的宽度与内容无关，所以可以使用text-align样式将内容定位在元素内。
最后，给你一个解决方案：
该物业有一个额外的价值，它提供了一个介于和display之间的中途房屋。很方便，它被称为. 如果您在 CSS 中指定 a ，它将继续作为内联元素工作，但也会具有块的一些属性，例如指定 a 的能力。为它指定宽度后，您将能够使用该宽度使文本居中blockinlineinline-block<span>display:inline-block;widthtext-align:center;
希望有帮助。
于 2011-10-13T16:06:04.470 回答
10
就像其他人所说的那样， span 是一个内联元素。
见这里：http ://www.w3.org/TR/CSS2/visuren.html
此外，您可以通过应用
style="display: block; margin: 0px auto; text-align: center;"
于 2011-10-13T16:03:50.580 回答
4
跨度是内联的，div 是块元素。即跨度仅与它们各自的内容一样宽。您可以对齐周围容器内的跨度（如果它是块容器），但不能对齐内容。
Span 主要用于格式化目的。如果要排列或定位内容，请使用 div、p 或其他块元素。
于 2011-10-13T15:58:41.990 回答
4
跨度标记仅与其内容一样宽，因此跨度标记没有“中心”。内容的两边都没有多余的空间。
然而，一个 div 标签与其包含的元素一样宽，因此该 div 的内容可以使用任何内容不占用的额外空间来居中。
因此，如果您的 div 宽度为 100 像素，而您的内容仅占用 50 像素，则浏览器会将剩余的 50 像素除以 2 并在内容的每一侧填充 25 像素以使其居中。
于 2011-10-13T16:03:22.030 回答
2
Span 被认为是一个内联元素。因此，基本上将自己限制在其中的内容中。它或多或少是透明的。
认为它具有“b”标签的行为。
它可以像 <span style='font-weight: bold;'>bold text</span> 一样执行
div 是块元素。
于 2011-10-13T15:58:43.483 回答
2
可能是因为您的 span 元素集的宽度与其内容一样宽。如果您有一个宽度为 500 像素且文本居中对齐的 div，并且您输入了一个 span 标签，则它应该居中对齐。所以你的问题可能是 CSS 问题。在 Firefox 上安装 Firebug 并检查您的 span 或 div 对象具有的样式属性。
于 2011-10-13T16:03:04.137 回答