如何在网站上进行自动缩放？任何分辨率的灵活性

Question

有没有办法如何使网站大小灵活到任何（或几个）分辨率，但每个元素的放大（缩放效果）？那么在更大的分辨率下，图像，按钮和输入会更大，还有文字？它甚至可能吗？

Answer 1

你需要为每个分辨率制作一个单独的CSS，或者你可以尝试jQuery技术！

为了以正确的分辨率运行正确的CSS，您需要使用media queries。

对于jQuery，请查看检查浏览器缩放的this问题。

使用像这样的媒体查询：

<link rel="stylesheet" media="(max-width: 800px)" href="example.css" /> <!-- for screen of width 800px -->

Answer 2

使用媒体查询...使用font-size的简单示例：

@media (min-width:400px) {
   p {
     font-size: 10px;
     }
  }
@media (min-width:800px) {
  P {
    font-size: 12px;
    }
  }

该示例仅适用于p元素，但可以应用于具有size属性的任何内容。