Question

.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>

Answer 1

试试这个：

background: url('/images/home-brk.png') center bottom no-repeat;

Answer 2

你的问题可能在：

.explorer ul li h2

您应该尝试不用它，将其更改为：

.explorer h2

IE中不显示h3中的背景图像

2 个答案: