0

私のウェブサイトで supergimage/jw プレーヤーの背景を作成中です。背景の上のコンテンツ div に CSS box-shadow を適用すると、影が背景と混ざりません (暗くなりません)。灰色のハローのように見えます。ボックス シャドウは白い背景でのみ機能しますか?

背景画像と混合する影の代わりにハロー（暗くする）

背景画像と混合する影の代わりにハロー

supergimage の背景と jQuery Isotope プラグイン div の CSS

#background {
    background: inherit;
    }

#superbgimage {
    display: none;
    }

.item {
    margin-bottom: 4px;
    -moz-box-shadow: 3px 3px 5px 6px #ccc;
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow: 3px 3px 5px 6px #ccc;
    }

背景の div

<fieldset id="background">
    <a href="media/background_0.jpg"></a>
    <a href="media/background_1.jpg"></a>
    <a href="media/background_2.jpg"></a>
    ...
</fieldset>

<div id="superbgimage"></div>

背景用スクリプト

<script type="text/javascript">
$(document).ready(function () {

$.fn.superbgimage.options = {
    preload: 1,
    randomtransition: 0,
    slideshow: 1,
    slide_interval: 9000,
    randomimage: 1,
    speed: 3000,
    transition: 1
};

$('#background').superbgimage().hide();

});
</script>
4

2 に答える 2

2

次のようなクロスブラウザ ソリューションを使用していることを確認します。

.shadow {
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px #888;
box-shadow: 0 0 5px #888;
}
于 2012-07-09T14:22:06.487 に答える
1

HEX の代わりに RGBA カラーを使用します。RGBA を使用すると、色の不透明度を設定して背景をにじませることができます。

例：

rgba(0,0,255,0.5)

補足として、box-shadow のような CSS3 要素用のオンライン ジェネレーターを使用してみてください。これらのより複雑な要素を作成する際に推測作業が必要なくなります。

http://css3generator.com/

于 2012-07-09T14:37:08.407 に答える