Question

我有一个div，只有在我设置滚动的最大宽度时才能正常工作。我希望能够将css中的最大宽度设置为设备宽度，这可能吗？使用像viewport.width之类的东西？

Answer 1

尝试

div{
  vw: 100;
}

1vw =视口宽度的1％

1vh =视口高度的1％

1vmin = 1vw或1vh，取较小者1

vmax = 1vw或1vh，取较大者

https://css-tricks.com/viewport-sized-typography/

Answer 2

在CSS中，您应该能够将max设置为％100。如果div是嵌套的，则可以设置绝对位置。

html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
  position: relative;
}
.not-nested {
  display: inline-block;
  max-width: 100%;
}
.nested {
  display: inline-block;
  position: absolute;
  max-width: 100%;
}
.half {
  display: inline-block;
  width: 50%;
}

<h1>Not Nested</h1>
<div class="not-nested">This dis has a max width of 100% and the text in it will wrap as it goes on and on and on and on and on and on and on and on.</div>

<h1>Nested</h1>
<div class="half">
  <div class="nested">This dis has a max width of 100% and the text in it will wrap as it goes on and on and on and on and on and on and on and on.</div>
</div>

我需要将divs max-width设置为device-width

2 个答案: