css - 如何通过 CSS 将 block 级元素转换为内联元素

Question

假设我有这个内容:

<div class="entry">
<p>I want to display <br /><h2>heading level elements like this</h2>
<p> as inline elements on the same line with the text that preceded them as well as...</p>
<p>the text that<br />
<h3>(another heading element)</h3>
<p>, follows them...</p>
</p></p>
</div>

我希望标题元素在文本中内联显示，就好像它们只是粗体文本一样，与内容的大小相同。

在不改变内容的情况下，有什么 CSS 可以通过上面的示例实现这一点的想法吗？

Answer 1

使用 display:inline 属性:

.entry h2,  /* Combining two selectors: h2/h3 as a child of class=entry */
.entry h3 {
    display: inline;
}

另请参阅:MDN, CSS display