jquery - 如何在响应式设计中定义高度

Question

我正在从事一个元素，我必须为其制作网站的响应版本。本站是一个用jquery制作的单页网站，定高定宽，绝对定位。站点的内容必须适合浏览器的视口(viewport)，查看它 here ,

现在的问题是，我不仅要处理屏幕的宽度，还要处理屏幕的高度，如果我同时针对固定的设备高度和宽度，代码会很庞大，有什么建议吗，我的计划使用，

@media screen and (max-width:479px) {...}
@media screen and (min-width:480px) and (max-width:639px) {...}
@media screen and (min-width:640px) and (max-width:959px) {...}
@media screen and (min-width:960px) and (max-width:1279px) {...}
@media screen and (min-width:1280px) and (max-width:1599px) {..}
@media screen and (min-width:1600px)  and (max-width:1919px){...}
@media screen and (min-width:1920px) {...}

但这并没有给出预期的结果，因为当前设计中的固定高度百分比。

拜托，任何建议。

Answer 1

我的理解是 - 您有 100% 的宽度和响应式高度。

为此，您可以将宽度设置为 100% 并使用媒体查询来保持高度。

我做过类似的事情 here .

看看是否有帮助。

谢谢