css - SPAN 与 DIV(内联 block )

标签 css html

是否有任何理由使用 <div style="display:inline-block">而不是 <span>布局网页?

我可以将内容嵌套在 span 中吗?什么是有效的,什么是无效的?

用这个做一个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>

最佳答案

According to the HTML spec , <span>是一个行内元素并且 <div>是 block 元素。现在可以使用 display 进行更改CSS 属性,但存在一个问题:就 HTML 验证而言,您不能将 block 元素放入内联元素中,因此:

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

即使您更改 <div> 也不是严格有效的至 inlineinline-block .

因此,如果您的元素是 inlineinline-block使用<span> .如果是 block level 元素,使用 <div> .

关于css - SPAN 与 DIV(内联 block ),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1611065/

相关文章:

css - 为什么填充不透明度会改变填充的阴影?

html - 如何在显示为 :block/none on child elem 的父元素上设置宽度动画

javascript - 如何在响应模式下单击按钮时使 "navbar-fixed-bottom"向上滑动? ( Bootstrap )

javascript - 隐藏的 div 在显示时移动

jquery - CSS jquery使用像素从底部到顶部移动一个div

CSS,居中的div,缩小以适合?

angularjs - 如何将列右对齐?

javascript - iPad 蓝牙键盘使用 onKeyUp 为任何键返回键码 0

html - 将 HTML 元素位置链接到图像

javascript - jQuery 在加载前捕获验证码图像或在加载后获取图像文件内容