网页布局中如何确定元素高度

可淘淘

在水平布局中，如果没有指定特殊的尺寸调整，则块元素通常与其父元素、负页边距、边框和边距有相同的宽度。元素的高度将根据其内容多少进行调整（文字换行次数越多，则元素高度越高）。对于其父元素拥有垂直布局的垂直元素而言，其工作方式是类似的。块元素与其父元素、负页边距、边框和边距有相同的高度。

将垂直元素与水平父元素的行为一同考虑时，元素高度将变得错综复杂（请记住，因为 BODY 元素总是水平的，所以这种情况是常见的）。水平父元素的高度是可变的，根据父元素的内容，这个高度有时很小，有时很大。根据父元素的高度来决定子元素的高度并不是一个好的解决方案，应当通过计算来决定最合适的高度。这种计算建立在变量数目的基础之上，包括字符大小（以第一个为基准）和文章中最长的单词。通常，垂直子元素的最小高度是10个字符高度。

当然，通过在标记中指定高度、宽度和位置，你可以降低绝大部分的复杂程度，并更好地控制布局。元素高度对于布局具有重要的作用，我们可以利用元素实现很多复杂布局效果。特别是对于绝对定位，突破了原来宽、高灵活性差的难题。充分发挥绝对定位的精确定位和灵活适应的双重能力。不过这种能力还是很有限度的，实践中读者应适当把握，毕竟绝对定位属于层布局模型，它与文档属于不同的层面。