height:100%;怎样才会有效果

转载于 2015-04-13 22:47:00 发布 · 70 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/cobish/blog/400749

本文详细介绍了如何使HTML中的div元素高度达到100%的方法，并提供了具体的实现代码示例。同时，文章还提醒开发者注意当div设置有margin和padding时可能引发的问题。

为什么80%的码农都做不了架构师？>>>

1、让div高度100%起作用，必须给它的父级标签也设置height:100%。

<html style="height: 100%;">
    <body style="height: 100%;">
        <div style="height: 100%;">
            <p>这样这个div的高度就会100%了</p>
        </div>
    </body>
</html>

2、该方法注意事项:

高度100%的div如果设置了高度上的margin和padding，页面就会出现滚动条，div高度变得比100%还大。
如果div的实际高度高于设置的100%，div的高度会自动扩展。

转载于:https://my.oschina.net/cobish/blog/400749