-3

現在の形式では、以下のCSSではページをスクロールできません。ただし、以下のCSSコードを無効にすると、ページでスクロールできるようになります。overflow属性を何度も設定してみましたが、を使用height: 130%するとスクロールバーが表示されますが、実際にはページがスクロールしません。

これが私の問題を示すJSFiddleです。

h1{
color: #FFF;
}

h3{
font-size: 25px;
    color: #990000;
    text-decoration: none;
    font-family: 'Chivo';
}

h5 {
    color: #bb0000;
    text-decoration: none;
    font-family: 'Chivo';
    font-size: 40px;
    line-height: 1em;
    font-weight: bold;

    }

h5:focus {
    outline: thin dotted rgb(51, 51, 51);
        outline-width: thin;
        outline-style: dotted;
        outline-color: rgb(51, 51, 51);
    outline-offset: -2px;
}

h5:hover, a:active {
text-decoration: underline;
color: #990000;
outline: 0;
outline-color: initial;
outline-style: initial;
outline-width: 0px;
}

/*box!*/

#boxdrop{
box-shadow: 0px 0px 10px grey;
position:fixed;
background-attachment:scroll;
left:10px;
}
#boxdrop2{box-shadow: 0px 0px 10px grey;}

.boxbg { background-color:#ccc;background-attachment:scroll; }
.boxbg2 { background-color:#ddd; background-attachment:scroll;}
.boxbg3 { background-color:#eee;background-attachment:scroll;}
.all-round {
border-radius:1em;
-moz-border-radius:1em;
-webkit-border-radius:1em;
}
4

2 に答える 2

4

スクロールを元に戻したい場合はposition:fixed、boxdrop div から を削除してください。

#boxdrop{
box-shadow: 0px 0px 10px grey;
background-attachment:scroll;
left:10px;
}

jsFiddle の例

于 2013-03-14T21:54:00.197 に答える
2

問題はあなたのHTMLだと思います。divid を持つ が 2 つありboxdrop2ます。また、divwith idboxdropにはposition:fixed属性があるため、divスクロールすることはできません。固定を使用すると、固定要素がページ内の要素の流れから離れるため、スクロールの可能性がなくなります。

于 2013-03-14T21:56:19.303 に答える