使用 display: inline; 样式属性可以将元素以内联（inline）显示方式呈现，这意味着元素不会独占一行，只占据其所需的空间，并允许其他元素与其在同一行上。
下面土嘎嘎小编分享一个示例代码，展示如何使用 display: inline;:
〓〓html代码如下：〓〓
<p>This is a paragraph of text.</p>
<span style="display: inline;">This is an inline element.</span>
在上面的示例中，第一个 <p> 标签中的段落文本是块级元素，默认情况下会独占一行。而第二个 <span> 标签中的行内元素使用了 display: inline; 样式，使其以内联方式显示。这样， <span> 元素将与其周围的文本内容在同一行上显示，而不会独占一行。
通过设置 display: inline; ，你可以在需要时将元素以内联方式进行布局，从而在页面中创建紧凑的视觉效果或实现水平排列的元素布局。土嘎嘎技术网友情提示：内联元素默认不可设置宽度、高度和外边距等属性，如果需要更多布局控制，则可以考虑使用 display: inline-block; 或其他布局方案。