问有什么关于“何时使用display:block when :inline和when :inline-block”的指南吗？

EN

inline -将元素视为内联文本块。width和height是没有意义的

block -将元素视为矩形。可以指定width和height

inline-block -使元素与文本内联，但允许指定width和height。

无论如何，元素缺省为其中之一。例如：

<span>、<em>、<strong> -> inline

<div>，<p> -> block

quirksmode.org有一个很好的截图解释：

http://www.quirksmode.org/css/display.html

块和内联的用例非常明显。如果要将样式应用于短范围的文本(例如，几个单词)，请使用内联，而对于宽/高的矩形区域，请使用块。

至于内联块，它很自然地用于图像。当您想让小块像普通文本一样从左到右、从上到下排列，但仍然像块一样排列时，它很有用。

注意:在90%的情况下，您不需要指定display属性，只需对类使用适当的元素，如用于内联的<strong>或<em>，用于块的<div>或<p>。它发挥作用的主要方式是，当使用Javascript隐藏内容时，您只需将元素还原为其原始/自然显示属性。