1

ヘッダー div にボックス シャドウを適用しました。そのヘッダー内に非表示の要素を表示するたびに、ボックスの影が正しくレンダリングされません。

<div id="header">
<div id="logo"> 
    <a href="#"><img src="logo.png" /></a>
    <div id="navBtn"></div>
</div>
<div id="navlist"> <!-- hidden -->
    <ul>
        <li><a href="coupons">Coupons</a>
        </li>
        <li><a href="trans">Buy</a>
        </li>
        <li><a href="about">About</a>
        </li>
    </ul>
</div>
</div>

本文から背景画像を削除しようとしましたが、削除すると問題は発生しなくなりました。問題が何であるかについてのアイデアはありますか？

JSFiddleデモ

4

2 に答える 2

0

これは、使用しているためですbackground-attachment: scroll;-値が示すように、背景はページのコンテンツ（ヘッダー）とともにスクロールします。fixed代わりに、ビューポートに関して背景画像が固定されるように使用する必要があります。

background-widthまた、 andは有効な CSS プロパティではないことに注意しbackground-heightてください。代わりにプロパティを探していると思いますbackground-size。

http://jsfiddle.net/RGLR3/6/

于 2013-08-14T02:12:02.163 に答える