0

妹の誕生日にニセ会社のホームページを作っているのですが、固定背景でちょっと困っています。シンプルで添付ファイルの問題であることはわかっていますが、何らかの理由で機能していないようです。理由は明らかに私ですが、これで私を助けてくれると思いました:)

ここにウェブサイトがあります: http://camilleperrin.fr/BBE/で、スクロールする必要があるときに問題が発生します (解像度が 1920x1080 の場合、このページ: http://camilleperrin.fr/BBE/index.php?ページ = キャリア)。巨大な画面を使用していて問題が見られない場合、背景画像が本来あるべき場所に留まらず、スクロールとともに下に移動します。

これが私のコードです(私はインターネットに助けられました。私はこれらすべてを自分で思いついたわけではありません):

CSS :

    body{
        background:url('background.jpg') no-repeat center 160px fixed;
    }

    #overallcontainer{
        padding: 70px 90px 120px 90px;
    }

    #blurcontainer {
        position: relative;
    }

    #blurbg{
        background:url('background.jpg') no-repeat center 160px fixed;
        text-align:center;
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;
        z-index: 99;  
        width:800px;
        margin:0 auto;
        padding:60px;

      -webkit-filter: blur(5px);
    }

    #textContainer  {
        position: relative;     
        z-index: 100;
        background: rgba(0,0,0,0.65);
        margin:0 auto;
        color:#dde;
        width:800px;
        padding:60px;
        text-align:justify;
    }

HTML :

<div id="overallcontainer">
    <div id="blurcontainer">
        <div id="blurbg"></div>
        <div id="textContainer">
            blah blah blah
        </div>
    </div>
</div>

ぼやけたテキスト コンテナーを保持したまま、これを修正する方法について何か考えがあれば、非常に役に立ちます。

ありがとうございました!

カミール

4

1 に答える 1