jquery - 无需滚动即可在任何浏览器屏幕尺寸中设置设计

Question

我需要用 html、bootstrap 等设计一个网站。主要要求是在任何浏览器窗口大小下，滚动条都不必出现。图像和其他必须为此进行调整。屏幕是这样的:

请帮帮我。

Answer 1

这是一个艰难的过程。您必须对高度使用媒体查询，考虑流行的高度并使中间高度状态的元素不会溢出屏幕。我建议您使用以下媒体查询并相应地调整每个媒体查询的元素:

@media (min-height: 1200px) {
    .banner{ height: 760px; } //example
}

@media (min-height: 1080px) {
    .banner{ height: 600px; } //example
}

@media (min-height: 900px) {
    .banner{ height: 560px; } //example
}

@media (min-height: 800px) {
    .banner{ height: 440px; } //example
}

@media (min-height: 768px) {
    .banner{ height: 400px; } //example
}

@media (min-height: 600px) {
    .banner{ height: 300px; } //example
}