javascript - 一种使用 CSS 变换尺度的响应技术

Question

我想知道如何使用 CSS 缩放属性使网站响应。

基本上代码会检测窗口宽度并相应地缩放元素，但是当您使用时会出现问题:

transform:scale(1.3);

例如，应用缩放的元素保持其 CSS 大小，因此，我想不可能通过 javascript 收集屏幕上元素的实际大小，这使得无法计算它应该是多少规模。

关于如何解决这个问题有什么想法吗？甚至可以根据窗口大小进行缩放吗？

Answer 1

可以使用 CSS 根据窗口大小进行缩放。最大宽度:50%；将使元素保持在浏览器宽度的 50%。

在整个页面中运行代码片段并调整浏览器的大小。

你是这个意思吗？如果我误解了，请原谅我。 :)

.max-width {
  height: 100px;
  background-color: blue;
  max-width: 50%;
}

<div class="max-width">

</div>