复制div背景

时间:2013-05-31 06:37:52

标签: html css

我正在尝试建立一个小网站,这是一个页面,在正文中有5个堆叠的div。第一个和第二个div很好但是之后的所有div(3,4和5)都在IE9中查看网站时重复独特的背景图像。该网站在FF 20.0.1,IE10,IE 10兼容性和IE9兼容性方面运行良好,因此这个问题似乎只出现在IE9中。我已经从CSS和html中取出了所有东西,只有那5个容器,并发现我无法查明导致背景图像在第3,第4和第5 div中复制的问题。我也重复了第二个div,它也复制了第二个实例中的背景。如果有人对我所缺少的东西有任何见解,我将非常感激。 此外,我在搜索解决方案时发现了无重复和其他想法,但此时没有任何对我有用。

CSS:

* {
    list-style: none;
    margin: 0;
    padding: 0;
    text-decoration: none;
}
body {
    font-family: Myriad, Arial, Helvetica, sans-serif;
}
p {
    margin-bottom: 1em;
}
a {
    color: #60789c;
    text-decoration: none;
}
a:visited {
    color: #60789c;
}
img {
    border: 0;
}
body {
    margin-bottom: 0px;
    margin-top: 0px;
}
div#content {
    margin: auto;
    padding: 0;
    width: 900px;
}
div#SectionOne {
    Background-image: url(../images/section1.jpg);
    height: 707px;
    width: 100%;
}
div#SectionTwo {
    Background-image: url(../images/section2.jpg);
    color: #FFFFFF;
    height: 1159px;
    width: 100%;
}
div#SectionThree {
    Background-image: url(../images/section3.jpg);
    height: 668px;
    width: 100%;
}
div#SectionFour {
    Background-image: url(../images/section4.jpg);
    height: 1385px;
    width: 100%;
}
div#SectionFive {
    Background-image: url(../images/section5.jpg);
    height: 1165px;
    width: 100%;
}

这是HTML:

<body>
<div id="content">
<div id="SectionOne">

</div>

<div id="SectionTwo">
<a name="SectionTwo" />


</div>



<div id="SectionThree">
<a name="SectionThree"/>

</div>

<div id="SectionFour">
<a name="SectionFour"/>



</div>

<div id="SectionFive">
<a name="SectionFive"/>


</div>

</div>
</body>

2 个答案:

答案 0 :(得分:0)

关闭a这样的<a name="SectionXXX"></a>代码而不是<a name="SectionXXX" />

HTML

<div id="content">
    <div id="SectionOne">
    </div>
    <div id="SectionTwo">
        <a name="SectionTwo"></a>
    </div>
    <div id="SectionThree">
        <a name="SectionThree"></a>
    </div>
    <div id="SectionFour">
        <a name="SectionFour"></a>
    </div>
    <div id="SectionFive">
        <a name="SectionFive"></a>
    </div>
</div>

答案 1 :(得分:0)

我建议你发布的内容是你将Background-image更改为background-image ......但这是一个很长的镜头。

您的<a>元素也不完整;并且name属性现在已过期。请改用ID。也就是说,如果要链接到其中一个div,请使用:

<a href="#SectionFive">Go to Section Five</a>

然后完全摆脱div中的那些a