0

对于我浏览器中的默认设置，width获取默认值100%并height获取默认值auto。

众所周知，垂直和水平的默认效果非常不同。盒子的宽度（a<div>例如，但使用的元素当然会改变结果）将默认为周围容器块元素的 100%。并且高度显然等于文本高度。

但是如果我设置width: auto;，意味着两者width和heightnow 具有相同的 value auto，那么效果仍然是非常不同的（实际上宽度没有区别）。

（我在 Windows 7 上使用最新版本的 Google Chrome，但这并没有什么大的区别——这里的浏览器并没有太大的不同。）

我的问题是，这两个非常相似的比例怎么会有这样的width差异height？如此大的差异以至于值auto给出了与两者截然不同的结果？

从一个元素到另一个元素获得与默认效果相同的效果是相当累人的。也就是说，要获得 100% 高度的效果以及适合文本宽度的宽度效果，这非常困难并且需要额外的工作/解决方法。我正在寻找的是auto更好地了解这两个比例及其价值。如果你们有一些好的资源和链接，我会很高兴。

4

2 回答 2

2

您的问题令人困惑，但我会根据我的理解回答

div是一个块级元素，默认height为auto且默认width为 ，100%因此如果您期望高度 = 文本高度，而不是宽度 = 句子/段落宽度，则需要使用display: inline-block;或float

所以简而言之，默认情况下height是针对块级元素的。autowidth100%

对于内联元素，heightis auto 和widthis auto （除非您使用height，width否则不会生效display: inline-block;）

演示

于 2013-07-16T12:56:08.990 回答
1

很简单，auto在传统 CSS 中评估高度和宽度的方式彼此非常不同，这是正常流程工作方式的结果。

CSS 2.1 规范的第 10 节auto详细描述了宽度和高度从类似值转换为使用值的方式。

于 2013-07-16T13:36:44.387 回答