Question

任何人都可以帮我找出我做错的事吗？点击链接查看有问题的网站 - click here

我不能让绿箱响应高度。它在宽度上缩放，但高度保持不变。我想将它重新调整大小，以便绿色框同时调整高度和宽度，并适合屏幕。

任何帮助都会受到赞赏，因为我真的不知道那里可能出现什么问题。

谢谢

Answer 1

您可以尝试将高度设置为自动/ 100％。

或

这可能不是你想要的，但我有类似的问题，媒体查询帮我解决了。

您可以设置最小宽度，具体取决于您设置div的高度。

 @media only screen and (min-width: 768px) {
         .loginbox
         {
          height: 120px; / height: 50%;
         }
     }

您可以参考W3schools进行媒体查询

Media Queries

Answer 2

您可以尝试相对于Bootstrap中的视点规则： Relative to view point。它是一个规则，其中div的屏幕独立于设备的100％。这是一个示例：
<div class="min-vw-100">Min-width 100vw</div><div class="min-vh-100">Min-height 100vh</div><div class="vw-100">Width 100vw</div><div class="vh-100">Height 100vh</div>

响应div高度 - Bootstrap

2 个答案: