我在我的网站上工作，我想有一个很好的报价。要做到这一点，我希望在文本的开始和结尾处有两个大引号图像，就像文本中所包含的一样，当我调整窗口大小时，将随文本一起移动。如何将图像合并到我的文本中？ HTML CSS
我试过用display：block和图像作为背景的span，但它像div一样工作。
如果我使用div和margin来放置它，它将保持在同一个地方，当我调整窗口大小并且不再与我的文本对齐时。
你会建议什么？
编辑
这里是我想什么：
使用范围是正确的选择，但你应该把它设置为inline或inline-block（或完全放弃它）。正如您发现的那样，将其设置为阻止使其占据整个宽度。
如果您可以使用除图像之外的其他东西，则可以在引号字符本身上放置一个范围，并使用任何Unicode或其他字体系列作为引号。然后，您可以将范围放在该范围内，然后根据需要进行设置，同时保留内嵌文本引用。
你可以试试这个原始的CSS，你可以自定义它，只要你想。
html {
background: gray;
}
blockquote {
background: white;
display: inline-block;
position: relative;
padding: 30px 30px
}
blockquote:before {
content: '"';
position: absolute;
font-size: 48px;
top: 10px;
left: 10px;
}
blockquote:after {
content: '"';
position: absolute;
font-size: 48px;
bottom: -10px;
right: 10px;
}<blockquote>
This is a sample of a blockquote.
</blockquote>编辑： 上面的代码与在本身就是一个固定的报价，结束报价没有在段落的末尾移动。
这一个应该这样做。
html {
background: gray;
}
blockquote {
background: white;
display: inline-block;
position: relative;
padding: 30px 30px
}
.ql,.qr {
position: relative;
}
.ql:before,.qr:after {
content: '"';
position: absolute;
font-size: 48px;
}
.ql:before {
top: -15px;
}<blockquote>
<span class="ql"></span> I am a sample of blockquote with a big quotation marks.<span class="qr"></span>
</blockquote>
<blockquote>
<span class="ql"></span> I am a sample of blockquote with a big quotation marks. You see it moves according to the length of what I'm saying.<span class="qr"></span>
</blockquote>引号不是图像，因此它适应你附加的字体它。请注意，不同的字体有不同的视图空间，因此可以相应调整。 – Roi
这个怎么样..
<p class="your-quote-wrapper">
<span><img src="/quote-icon-left.png"></span>Blabla blabla text<span><img src="/quote-icon-right.png"></span>
</p>
而且你的跨度是inline-block
p.your-quote-wrapper{
display:inline-block;
}
使用伪元素。但是，向我们展示您的标记会很好。 – Terry
你去了哪里，我已经添加了一张图片来向你展示我想要的东西 –
http://jsfiddle.net/soledar10/bmcz6uxh/ – Dmitriy