css - 在 h3 类 (WordPress) 上使用背景图片

Question

这是我想要获得的效果的图像：

这是我得到的实际图像：

这是网站http://ratest10.com/?page_id=2

我试过这个；

.widget-container {
margin: 0 0 18px 0;
background: #FFFFFF;
width:204px;
padding: 0 8px;
overflow:visible;
}
.widget-title {
color: #222;
font-weight: bold;
background: url(images/sidbar-title-bak.png);
width:240px; height: 45px;
}

然后尝试使用各种变体，包括溢出：可见，并将 html 结构更改为一个 div，其中包含一个包含 h3 的类，只是没有得到任何结果。

这是一个 WordPress 网站，其 html 是...

<li id="categories-2" class="widget-container widget_categories"><h3 class="widget-  title">Categories</h3> <ul> 

Answer 1

问题是白色背景的容器没有你的h3那么宽。但是，您可以移动背景位置以将其显示出来。例如：

.widget-title {
background-position:-19px 0;
}

编辑：

实际上很抱歉，通过查看您的图像，我意识到您希望它脱离白盒。这是您需要做的。

.widget-title {
position:absolute;
}

#main .widget-area ul {
background-color:#FFF;
}

然后您可能需要更改图像的宽度。他们现在似乎有点长了。或者你可以像我之前所说的那样使用背景位置。