.explorer ul li h2中的背景图像未在IE中显示，但在chrome和firefox中显示。当.explorer h1中的背景图像在所有浏览器上正确显示时。
我有以下的CSS和HTML
的CSS
.explorer
{
width:100%;
height:240px;
}
.explorer h1
{
display: inline-block;
text-align: center;
font: 300 16px/30px "etica", Arial, "Helvetica Neue", Helvetica, sans-serif;
text-transform: uppercase;
color: #4f2b0d;
width: 100%;
background: url('/images/home-difference.jpg') center center no-repeat;
}
.explorer ul
{
margin:0;
padding:0;
list-style:none;
width:788px;
height:185px;
}
.explorer ul li h2
{
display: inline-block;
text-align: center;
font: 300 16px/30px "etica", Arial, "Helvetica Neue", Helvetica, sans-serif;
text-transform: uppercase;
color: #1b91c2;
width: 100%;
background: url('/images/home-brk.png')no-repeat center bottom;
margin-bottom: 10px;
padding-bottom:18px;
text-shadow:none;
}
.explorer ul li
{
width:230px;
height:185px;
float:left;
padding:0 20px 0 20px;
font-family:Arial, Helvetica, sans-serif;
font: 12px/18px;
color:#6f6f6f;
margin:0;
position:relative;
}
.explorer ul li div
{
background:url(/images/big-btn.png) no-repeat;
width:190px;
height:39px;
color:#6d6129;
font:bold 12px/39px Arial, Helvetica, sans-serif;
position:absolute;
text-align:center;
position:absolute;
bottom:0;
left:30px;
}
.explorer ul li div:hover{ background:url(/images/big-btn-hvr.png) no-repeat;}
我的HTML
<div class="explorer">
<h1>Explore the world of Financial Opportunities</h1>
<ul>
<li>
<h2>Financial Planning</h2>
Explore the power of smart calculators. A conscious effort towards Financial Planning is the CORE TO STRESS FREE LIFE.
<a href="/"><div>Click here to start Planning</div></a>
</li>
</ul>
</div>
最佳答案
尝试这个：
background: url('/images/home-brk.png') center bottom no-repeat;
关于html - IE中未显示h3中的背景图片，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21208987/