< span>和< div> with text-align：center ;? [英] Difference between <span> and <div> with text-align:center;?

问题描述

我不明白这一点：

我试图将HTML < span> 标签，但它没有什么...
使用< div> 标签，一切工作。相同的位置，在css中设置 margin：0px auto;

I have tried to center the text-align of a HTML <span> tag but it did nothing... With the <div> tag, everything worked. Same sittuation with setting margin: 0px auto; in css.

为什么span标签不支持 text-align; function？

Why does the span tag not support the text-align; function?

推荐答案

$ c>< span> 和< div> 和块元素。 < span> 默认为 display：inline; ，而< div> code>默认为 display：block; 。

the difference is not between <span> and <div> specifically, but between inline and block elements. <span> defaults to being display:inline; whereas <div> defaults to being display:block;. But these can be overridden in CSS.

方法之间的区别 text-align：center

A block 元素默认为其容器的宽度。它可以使用CSS设置其宽度，但是任一种方式都是固定宽度。

A block element defaults to being the width of its container. It can have its width set using CSS, but either way it is a fixed width.

inline

text-align：center 指示文本中心位置在元素。但在 inline 元素中，这显然不会有任何效果，因为元素的宽度与文本相同;

text-align:center tells the text to position itself centrally in the element. But in an inline element, this is clearly not going to have any effect because the element is the same width as the text; aligning it one way or the other is meaningless.

在块元素中，因为元素的宽度是独立的内容，可以使用 text-align 样式在元素中定位内容。

In a block element, because the element's width is independent of the content, the content can be positioned within the element using the text-align style.

为您：

display 属性有一个额外的值，提供 block 和 inline 。方便地，它被称为 inline-block 。如果在CSS中指定< span> 为 display：inline-block; 作为内联元素，但也将承担块的一些属性，例如指定 width 的能力。一旦指定了宽度，您就可以使用 text-align：center;

There is an additional value for the display property which provides a half-way house between block and inline. Conveniently enough, it's called inline-block. If you specify a <span> to be display:inline-block; in the CSS, it will continue to work as an inline element but will take on some of the properties of a block as well, such as the ability to specify a width. Once you specify a width for it, you will be able to center the text within that width using text-align:center;

希望有所帮助。

这篇关于< span>和< div> with text-align：center ;?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！