想通过设置元素的高度来为其设定尺寸，或者包裹它、拉伸它。下面我们给大家介绍一下设定html5高度吧!

CSS为此提供了height属性。本节属于对尺寸、包裹和拉伸设计模式的入门。此设计模式是为了对比6种不同盒类型(内联、内联块状、块状、表格、绝对定位和浮动)应用height的不同方式。这种对比会使我们更方便的选择出最佳的高度、元素、显示组合，从而创建出你想要的布局。

height对所有元素类型都起作用，除了内联元素。height在不同类型、定位、浮动方式的元素上表现各不相同。height与width是完全独立的。height:auto是默认设置。

height:auto

height:auto竖直包裹着以下几种盒模型：内联、内联块状、块状、浮动、表格和绝对定位(当top和bottom都设置为auto的时候)。

height:auto竖直拉伸绝对定位盒模型，仅当top和bottom都设置了一个值(例如0)的时候。这是竖直拉伸盒模型的最好方法，因为height:100%会有一些局限性，但是这仅仅对绝对定位盒模型有效。

height:+VALVE

可为元素的height赋予px、em、百分比或其他单位的尺寸。当可视画面比预想的大或小的时候，固定高度的元素可能对用户就不那么友好了。百分比的灵活度会更大一些，因为它们能随可视画面的大小而调整。

height:100%

height:100%会把元素的高度设置成与父元素一样，但是不像auto,height:100%拥有一些局限。浏览器不会自动调整高度以保持元素的拉伸状态。元素的垂直外边距、边框或者内边距能够扩展它的高度，甚至可超越父元素的高度。

模式

SELECTOR { height:+VALUE; }

适用范围

height可应用于内联元素之外的所有元素。

提示

浏览器会忽视静态内联元素的height,因为font和font-size决定了它的文本宽度，从而决定了元素的高度。

用height:100%可拉伸表格，它的运行方式与垂直拉伸绝对定位元素大同小异。当你为表格设置了边框或者内边距后，表格的外盒便不会增大了，而且它也不会溢出它的父元素。这是因为边框和内边距都位于表格的内部，并且不能溢出它的外盒。另一方面，表格的外边距会对表格重新定位，这可能会导致溢出父元素。

以上就是我们给大家介绍的设定html5高度的方法了。希望大家继续关注我们的网站!