Question

我们希望了解网站的响应式设计。适用于

网站的高度和宽度。我们可以让网站对高度做出响应吗？

请帮我找到解决方案。

如果您需要澄清，请告诉我

提前感谢。

Answer 1

大多数人倾向于将响应式设计视为对不同屏幕宽度的响应，然后允许用户在任何屏幕上以最佳方式查看内容但确实意味着他们仍然必须滚动查看下面的更多内容。

然而，在垂直响应式设计方面也有一种思路，它会根据您的需要来查看高度和宽度的响应式设计。

这里有一篇很棒的文章：

它包含一些很好的小小片段，可以帮助您入门，通常使用视口高度来提供最佳间距，并使用响应式设计调整高度和宽度。

大多数现代浏览器支持视口高度，但您也可以使用@media规则，就像使用宽度一样，为不同的屏幕高度设置不同的CSS规则：

@media screen and  ( max-height:540px ){
somecss:rules;
}

在这里有一些关于使用@media for height的进一步阅读：

希望这有帮助。