问题描述:一个页面中想要分成上下两部分各占50%。想要50%生效得在body的样式中进行设置,但是单纯在body中加上height:100%,是无法生效的,解决办法有两种:
①:在body样式中添加height = 100vh;
vw (viewport width) vh (viewport height) 是视窗的大小,100vw = 100%视窗宽度 100vh = 100%视窗高度,用vw,vh设定的大小只和视窗大小有关,和他们的父元素高度宽度没关系。
②:设置html,body{ height:100% }
因为% 是相对于父元素的大小设定的比率,div的父元素为body,body的父元素为html。而浏览器默认状态下,没有设置html的高度,如果仅仅设置body的100%,不设置html元素的高度为100%,那么body的高度不会生效, body的高度没有参考高度,那么div的百分比高度则无效。