在图片上添加文字

<ul class="departmentheadpic">
<li style=" background:#68aae1 url(skin/images2/department.png) no-repeat center top;">
<div style="width:1000px;height:230px;margin:0 auto;">
<div class="pictext"><%=pdmc %></div>
</div>
</li>
</ul>

 

 

css

.departmentheadpic {height:230px;width:auto;background-color:#fff;padding-top:2px;padding-bottom:2px; position:relative;}
.departmentheadpic li{height:230px;width:auto;}
.pictext
{
position:relative;
top:150px;
left:220px;
font-size:26px;
font-weight:bold;
font-family:微软雅黑,宋体;
color:#fff;
letter-spacing:2px;
}

注意检查前面的div元素中是否有float以及高度超过本身高度的元素，以免使得在ie兼容模式下与谷歌浏览器下文字离左边的距离不等

转载于:https://www.cnblogs.com/miraclesakura/p/3939395.html