SPAN与DIV（内联块） [英] SPAN vs DIV (inline-block)

问题描述

有任何理由使用< div style =display：inline-block> 而不是< span& 布局网页？

Is there any reason to use a <div style="display:inline-block"> instead of a <span> to layout a webpage?

我可以将内容嵌套在span内吗？

Can I put content nested inside the span? What is valid and what isn't?

可以使用这个来制作3x2的表格布局吗？

It's ok to use this to make a 3x2 table like layout?

<div>
   <span> content1(divs,p, spans, etc) </span>
   <span> content2(divs,p, spans, etc) </span>
   <span> content3(divs,p, spans, etc) </span>
</div>
<div>
   <span> content4(divs,p, spans, etc) </span>
   <span> content5(divs,p, spans, etc) </span>
   <span> content6(divs,p, spans, etc) </span>
</div>

推荐答案

根据HTML规范，< span> 是一个内联元素，< div> 是一个块元素。现在可以使用 display CSS属性更改，但有一个问题：在HTML验证方面，您不能将块元素放在内联元素中：

According to the HTML spec, <span> is an inline element and <div> is a block element. Now that can be changed using the display CSS property but there is one issue: in terms of HTML validation, you can't put block elements inside inline elements so:

<p>...<div>foo</div>...</p>

即使更改< div> 到 inline 或 inline-block 。

因此，如果您的元素 inline 或 inline-block 使用 span> 。如果是块级别元素，请使用< div> 。

So, if your element is inline or inline-block use a <span>. If it's a block level element, use a <div>.

这篇关于SPAN与DIV（内联块）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！