0

ボディ内に 5 つのスタック div を持つ 1 つのページである小さな Web サイトを構築しようとしています。最初と 2 番目の div は問題ありませんが、その後のすべての div (3、4、および 5) は、サイトが IE9 で表示されると、すべて固有の背景画像を繰り返します。サイトは FF 20.0.1、IE10、IE 10 互換性、および IE9 互換性で正常に動作するため、この問題は IE9 でのみ発生するようです。これらの 5 つのコンテナーを除いて CSS と html からすべてを取り出しましたが、3 番目、4 番目、5 番目の div で背景画像が重複する問題を特定できないことがわかりました。2 番目の div も繰り返しましたが、2 番目のインスタンスの背景も複製されます。私が欠けているものについて誰かが何か洞察を持っているなら、私はそれを大いに感謝します. また、

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

2 に答える 2