html - 带有背景图像的 div 与某些跨度在同一行，同时位于 p 内

Question

我有以下 HTML 标记:

<p><span>Hello</span>&nbsp;<div class="show" /></p>

现在 div 的 background-image 属性设置为一些图像:

.show {
    background-image: url(http://doc.jsfiddle.net/_downloads/jsfiddle-logo.png);
    background-size: contain;
    width: 40px;
    height: 40px;
    display: inline-block;
}

由于 p 围绕着它们。在保留 p 的情况下，这甚至可能吗？

Here is a JSFiddle展示问题

Answer 1

你不应该把 div里面的元素<p>元素。一种简单的修复方法是替换 div对于 span .

<p><span>Hello</span>&nbsp;<span class="show" /></p>