Question

我正在尝试创建这样的东西：

但是我不确定他们是如何根据窗口大小实现div的重新调整大小的。他们如何能够在div中设置标题以保持在不同窗口大小的中心。在某个窗口大小之后，图片和div中的单词变得更大，在一定大小之后变小。图片保持高清状态，未拉伸或压缩。请帮忙。

Answer 1

css中有一条规则称为@media规则它可以用作响应式网页。

例如。

的CSS

<style>
   body {
      background-color: lightblue;
   }

   @media screen and (min-width: 480px) {
      body {
         background-color: lightgreen;
      }
   }
</style>

HTML

<body>
   <h1>Resize the browser window to see the effect!</h1>
   <p>The media query will only apply if the media type is screen and the viewport is 480px wide or wider.</p>
</body>

窗口大小调整html css

1 个答案: