html如何设置高度

142 阅读 0 评论 94 点赞

我是靠谱客的博主朴实玫瑰，最近开发中收集的这篇文章主要介绍html如何设置高度，觉得挺不错的，现在分享给大家，希望可以做个参考。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

首先新建一个html页面并设置为height.html,设置标题为“html设置页面高度”。

$T4P)3`1I~{ZKHVG}]JI~}_O.png$

在html页面的body中加一个div，并设置样式的类名为 class，主要是为了在div上加样式来设置高度

VKW6C1B`U`$E2QBA8ZAG`O9.png

在.class 中设置一个红色的边框，背景色为绿色的div并设置height为500像素

XZ5)W7NO_(VVWINWG0}25@8.png

如果想要设置div的边框高度跟body一样，或者随着div里面的内容不断增加而自动增加自适应高度就要把div的样式的高度设置为100%，这样就会随着页面的高度的增加而增加

4J~D]UMYWS32I2RLT4H%C5X.png

WSS`8PYIP1UI_9USBPW0PYP.png

如果浏览器支持css3标准的话，可以设置高度单位为vh

$]_DR$407055{25[KOEEC[}0.png$

将样式中的 .class中的高度设置css3 的标准height：100vh这样div不需要子元素的高度来适应高度，自己就可以完全占满浏览器页面的高度

GTO3VACLE54N0N%`SWW0T4E.png

推荐学习：html视频教程

以上就是html如何设置高度的详细内容，更多请关注靠谱客其它相关文章！

以上就是朴实玫瑰为你收集整理的html如何设置高度的全部内容，希望文章能够帮你解决html如何设置高度所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。