41

divの1つに影を付けようとしていますが、表示されません。これが私がシャドウを実装しようとしている1つのdivです：

#intro {
    padding: 0px;
    margin: 0px auto;
    width: 100%;
    float:inherit;
    overflow: hidden;
    height: 800px;
    position:inherit;
    background-color: #00b3e1;; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}

URLは次のとおりです：http：//rachelchaikof.com/awareness/

4

2 に答える 2

174

影が見えないのは、次の div (#one) がそのすぐ下にあり、影が #one の下でレンダリングされているためです。#one から背景画像を削除すると、影が表示されます。

これを #intro の CSS に追加して、影が見えるようにします。

position: relative;
z-index: 10;

他のテキスト領域に影を表示したい場合は、それらの z-index 値も調整し、一番上の要素 (#intro) の値を最大にする必要があります。

于 2012-12-07T23:16:25.890 に答える
0

私が今日持っていた別のシナリオ。div に対して相対的な位置を設定しても、ボックスの影が表示されませんでした。どうやら、この div の横にはボックス シャドウのあるコンテンツがありませんでした。

コンテンツが追加されると、box-shadow が表示されました。

于 2016-02-19T06:38:12.490 に答える