Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > html和body的高度100%引发的问题_html/css_WEB-ITnose

html和body的高度100%引发的问题_html/css_WEB-ITnose

WBOY
Release： 2016-06-24 11:32:55
Original
1376 people have browsed it

在写reset css时，一般会有这样的代码：html,body{width:100%;height:100%};

这样会有一个问题，就是body里面div的高度常常是超过了body本身的高度。如图：

实际包含在body里面的div的高度是800px;

这里可以知道html设置height:100%，html的高度就是document的可视高，body由于设置height：100%;继承了html的高度，也是可视高。

所以为了避免这个问题，不要给body设置height：100%即可

 

Related labels：
html和body的高度100%引发的问题
source：php.cn
Previous article：DIV+CSS实操五：经管系网页内容模块内容添加(二)_html/css_WEB-ITnose Next article：使用jQuery timelinr和animate.css创建超酷的CSS动画时间轴特效_html/css_WEB-ITnose
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
How to solve the mysterious white space at the bottom of the page in CSS I'm trying to build a simple webpage using Bootstrap and D3, but I don't know how to get r...
From 2024-04-06 20:22:15
0
1
454
Why is my hr tag translucent when it is set to a solid color of white? I have a html (with bootstrap) and a css, in my html I have a <hr> tag which has a c...
From 2024-04-06 16:13:26
0
1
500
I'm having trouble with a CSS grid where the height isn't what I expected, what mistakes might I be making? I'm currently learning CSS grids and was asked to make this card by breaking it into a gri...
From 2024-04-06 12:52:14
0
1
339
Set the bottom to 100% of its own height I want to set up an element so that it is hidden from the page view and its top just touch...
From 2024-04-04 22:41:16
0
1
1438
Make sure the table cell's container fills the entire height of the parent I'm trying to vertically align the content without using Flexbox, because there are some i...
From 2024-04-04 16:03:18
0
1
404
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template