溢出时显示不必要的水平滚动条：滚动

-3

我试图在单个页面上制作一个网站，页面的每个部分都占据了用户屏幕的大小（使用backstrech作为背景）。像这样：http://projects.lukehaas.me/scrollify/#home 溢出时显示不必要的水平滚动条：滚动

问题出在用户的屏幕高度太小而不能包含我的网页内容。在这种情况下，我希望我的背景伸展得比用户的屏幕多，因为它必须填充整个内容的背景。

所以，我一直在使用overflow：scroll，它修复了整个问题，除了显示恼人的水平滚动条，即使不需要。我的意思是，即使在全屏时有完全没有溢出，水平滚动条出现

这是我的代码：

section#page1 { 
    background: url('../img/background.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100vh; 
    overflow: scroll; }

来源

2016-08-23 Berry Jones

使用'overflow：auto;'?!或'overflow-y：scroll;'。或'overflow-x：hidden;'。你之前测试过什么？ – eisbehr

试试这个：

section#page1 { 
    background: url('../img/background.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100vh; 
    overflow-x: hidden; 
    overflow-y: scroll; 
}

来源

2016-08-23 11:17:30 BonifatiusK

是的！不知道我可以分开x和y。谢谢！ –

section#page1 { 
    background: url('../img/background.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100vh; 
    overflow: auto; 
}

来源

2016-08-23 11:24:23

溢出时显示不必要的水平滚动条：滚动

回答

相关问题