Question

.box {
  background-color: DarkSeaGreen;
  padding: 0px;
  margin: 0px;
  float: left;
  min-height: 50px;
  min-width: 50px;
  max-height: 100px;
  max-width: 100px;
}

<div class="box">
  ab cd ef gh ij kl mn
</div>

在上面的代码中，我们使用min-height和min-width作为50，max-height和max-width作为100。

默认情况下，如果我开始放置文本，默认行为是DIV框将首先在宽度级别增加大小.i.e。首先，它会将宽度从50增加到100，然后它将开始增加高度。

我想知道我们是否可以更改订单。即首先是高度，然后是宽度。

即。首先它应该从最小高度增长到最大高度。一旦达到最大高度，它应该开始增加宽度。

Answer 1

原因是因为您的浏览器默认使用writing-mode的CSS属性：horizontal-tb。文字从左到右，然后从上到下填充框，这是我们在大多数西方世界中写字的方式。如果您将CSS更改为书写模式：vertical-lr，文本将从上到下然后从左到右填充框。在这种情况下，你填充看到框去到它的最大高度，然后开始增加宽度，直到你达到极限。

另见https://developer.mozilla.org/en-US/docs/Web/CSS/writing-mode

如果在div的情况下如何首先按高度增加框尺寸然后按宽度增加框尺寸？

1 个答案: