我写了一个如here所示的网页。我为所有css
和js
库使用了外部CDN。
我使用了css
(我自己的css):
#imgOne {
position: fixed;
bottom: 35%;
width: 100%;
/* Set the fixed height of the footer here */
height: 10%;
background-color: #E9E9E9;
background-image: url(../images/Bistip-in-media.png);
background-repeat: no-repeat;
background-position: center;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}
#imgTwo {
position: fixed;
bottom: 45%;
width: 100%;
height: 16%;
background-image: url(../images/Skyline.png);
background-repeat: no-repeat;
background-position: center center;
box-shadow: 0px 10px 6px -6px #777;
background-color: #FFF;
}
#formPos, #formPosOne {
position: relative;
width: 34%;
height: auto;
box-shadow: 0px 10px 6px -6px #777;
background-color: #166BB3;
margin-top: 8%;
margin-left: 10%;
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 35%;
background-color: #166bb3;
}
html,
body {
height: 100%;
width: 100%;
overflow: auto;
}
但整页不滚动。只有包含蓝色div
的部分才会滚动。我该如何解决?
答案 0 :(得分:0)
这会使您的主容器内容滚动,但您需要更多地放置容器
.containerA{
overflow-y: auto;
}