css - 是否有任何 HTML 元素作为典型的内联 block 存在？

Question

div 是典型的 block 级元素，span 是内联元素。它们是该显示类型的最简单形式，没有其他属性。在很多情况下，我会给它们中的任何一个赋予样式:

display: inline-block;

这使它们的行为非常方便。对于 div，它意味着可以轻松并排放置的框，同时保持它们定义的宽度和高度。对于 span，我可以用它来制作彩色矩形。 inline-block 显示非常适用于很多事情，但我从未见过一个元素以 inline-block 开头而没有任何其他事情发生。

图像 (img) 是，但它们显然不适合与 div 相同的东西，它们具有那种风格，但是它们实现了不同的目的。

那么，是否有一个我不知道的元素是典型的 inline-block，还是被遗漏了？

如果不是，为什么？ inline-block 的用途很多，所以似乎应该有一些采用这种基本形式的元素。

Answer 1

没有这样的元素，但有一些很好的理由。

inline-block在当代网页设计中有多种用途。但是它不是 original design 的一部分。 ，它只包括 block 元素和行内元素。相反，它源自 <img>由 NSCA Mosaic 添加。 (它使用 the wrong markup 并帮助击败了最初的“响应式设计”。我认为我们才刚刚开始 fix the problems with img)。

再往下看，inline-block仍然不是 IE4 或 5 或任何版本的 Netscape 的一部分。它不是早期 HTML4 时代的一部分。所以我们不希望在该版本的标准中找到您的假设元素。 inline-block只出现在HTML4之后的CSS2中. (查看每个标准中的引用部分)。

不同于block , inline-block is affected by whitespace in the markup .它由名称暗示，这就是您在查看 <img> 时所期望的。在一些文本的中间(又名文字处理器对象锚定为“字符”)。但除了它的起源之外，依赖于空格的标记很快就变得非常麻烦。我不希望 W3C HTML5 将其包含在一个新元素中。

指定它肯定会涉及关于“语义”、内容和表示分离等的争论(以及如何调用它:)。如果默认渲染使空白变得重要 - 那不是该元素语义的一部分吗？考虑使用图像来表示单词 - 或单词的单个字母(带有适当的替代文本)。这说明此元素周围存在(或不存在)空格在语义上很重要，就像存在分隔单词的空格在语义上很重要一样。这对我来说似乎是个大问题。

inline-block通常被提升为使用 float 的现代替代方法到处。但两者都不是真正合适的。这就是 CSS3 将标准化新布局模式的原因:"flexbox"和 "grid" , 以支持具有真实、干净标记的现代响应式设计。没有虚拟标记(或虚拟生成的内容)。没有围绕空白依赖的黑客攻击。