0

私は自分の問題を猛烈にグーグルで調べてきましたが、問題を解決できないようです。

左右の方向ボタンで 8 つの画像をスクロールする iFrame を作成しました。画像を保持text-align: center;するDIVと、右矢印 (#leaf2) が消えます。

これが私のHTMLです。

<html>
<body>

<div id="leaf1"><button onClick="image_onclick('prev');"><img src="images/leaf.gif/></button</div>
<div id="image_box"></div>
<div id="leaf2"><button onClick="image_onclick('next');"><img src="images/leaf2.gif"/></button></div>

</body>
</html>

これが私のCSSです。

body, p, image{
    margin: 0;
    padding: 0;
}

button{
    background-color: #ffffff;
    border: 0;
}

#image_box{
    text-align: center;
}

#image_box img{
    border: 1px solid black;
}

#leaf1{
    position: absolute;
    margin: 155px 0 0 8px;
}

#leaf2{
    position: absolute;
    margin: 160px 0 0 850px;
}
4

2 に答える 2

1

これがコピーのエラーかどうかはわかりませんが、
</button></div> の代わりに </button</div>があります

また、image_box 内で画像を中央に配置しようとしている場合は、左右の余白を auto に設定する必要があります。そう：

            image_box img{
                margin: 0 auto; /* or margin-left:auto; margin-right:auto; */
                border: 1px solid black;
            }
于 2011-07-12T20:25:57.567 に答える
0

ここには、いくつかの構文の問題があります。

<img src="images/leaf.gif/></button</div>

src属性と<button>要素を閉じると、ページのレンダリングが異なりますか?

<img src="images/leaf.gif"/></button></div>

text-align: centerまた、投稿したコードによると、空の divに適用していることにも注意してください。

于 2011-07-12T20:33:16.440 に答える