Question

我有一些类似于第一个代码段的代码-我很好奇是否可以使用调整大小并允许其忽略最大高度吗？

我不仅仅使用height的原因是我希望div适合第一部分内容而没有空白。如果您想查看一下，我会在最后添加。

基本上，我正在尝试获得类似于第一个的东西，但功能类似于第二个。

谢谢！

.content {
  max-height: 5em;
	overflow-y: auto;
	resize: vertical;
  white-space: pre-wrap;
 }

<div class="content">One line</div>
<div class="content">Multi
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
line</div>

由于多余的空格，这不适用于我要执行的操作：

.content {
  height: 5em;
	overflow-y: auto;
	resize: vertical;
  white-space: pre-wrap;
 }

<div class="content">One line</div>
<div class="content">Multi
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
line</div>

响应第一个答案，内容是动态的。我提供了一个动态示例

rand1 = Math.floor((Math.random() * 10) + 1);
rand2 = Math.floor((Math.random() * 10) + 1);
document.getElementById("1").innerHTML = "Start"
for (var i = 0; i < rand1; i++) {
  document.getElementById("1").innerHTML += ".\n"
}
document.getElementById("2").innerHTML = "Start"
for (var i = 0; i < rand2; i++) {
  document.getElementById("2").innerHTML += ".\n"
}

.content {
  max-height: 5em;
  overflow-y: auto;
  resize: vertical;
  white-space: pre-wrap;
}

<div class="content" id="1"></div>
<div class="content" id="2"></div>

Answer 1

您可以使用纯CSS来实现。调整元素大小时，会在html元素的样式标签内自动生成height属性。

如果您创建一个引用该属性的css选择器，并在存在“ height”的情况下取消max-height，则会获得所需的效果。

saveAll

Answer 2

按照以下 ~~<div class="content">One line</div>~~ 删除一等师。

<div>One line</div>

Answer 3

这个问题还不清楚。似乎您要第一个动态高空的容器，第二个最大高度，是吗？

如果您想要填充第一个div内容的内容，可以将min-height用于第一个容器，而仅将max-height用于第二个容器一个。

允许调整大小以忽略最大高度吗？

3 个答案: