Heim > Artikel > Web-Frontend > CSS-div高度100%设置问题_html/css_WEB-ITnose
CSS-div高度100%设置问题_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:33:33945Durchsuche
div常用的属性width和height，有的时候如果我们需要让div的高度是整个屏幕的高度，设置height：100%发现并没有什么作用，并不是这样设置不对，而是w3c规范中关于百分比的设置是相对于父元素的，如下所示:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>博客园-FlyElephant</title> <style type="text/css"> .parent { background: red; height: 100%; } </style></head><body> <div class="parent"> 博客园-FlyElephant </div></body></html> 发现div的高度只是文字的高度，如果需要让div铺满整个屏幕，我们需要设置一下父级元素的高度，也就是html和body:
html,body { height: 100%; padding: 0; margin: 0; } 高度是相对于父级元素的，但是html级元素默认宽度是100%，即整行~
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：微信公众号与HTML 5混合模式揭秘1--如何部署JSSDK_html/css_WEB-ITnoseNächster Artikel：zend 设置html编码乱码的问题_html/css_WEB-ITnose