将背景图像和自定义项目符号应用于css标题

Question

所以我的<h1>应该有单独的自定义图案背景和单个图像项目符号。问题是，我不能将两个样式元素都应用为背景图像（我听说你可以用CSS3创建几个bg图像？但我现在想尝试更多跨浏览器兼容的方式。）< / p>

HTML：

<div id="content">
<h1>Heading</h1>
<p>Paragraph</p>
</div>

的CSS：

#content > h1 {
background: url("heading-bg.png") repeat; 
padding: 25px 0 25px 80px;
}

现在我尝试做这样的事情，以便在css中的<h1>前面获取子弹图像：

#content > h1:before {background: url("bullet1.png") no-repeat left;}

我可以在我的<h1>周围添加另一个div并在其上应用模式，子弹直接在<h1>上。有没有更聪明的方法来实现我想要的效果呢？

谢谢！

Answer 1

是的，之前和之后除非有内容，否则以后不会工作，

你也可以这样做

#content h1:before{
  content:"";
  width:50px;
  height:50px;
  background:url('images/bullet.png');
}