html 怎么设置body的高度

html-css024

html 怎么设置body的高度,第1张

1、在怪异模式下,也就是网页头部不写doctype的时候,body可以作为html元素的根元素,设置它的高度为百分之百的时候(不考虑外边距),可以使的页面的高度和浏览器客户区相同。

在标准模式下,也就是网页头部写doctype的时候,body不是html页面的根元素,html才是根元素,如果仅仅设置body的100%,不设置html元素的高度为100%,那么body的高度不会生效,之所以不生效,是因为如果要以百分比设置元素的尺寸,必要以父元素的尺寸作为参考,如果父元素没有设置尺寸,自然不会生效。

2、在标准模式下,由于没有设置html的高度,所以body的高度100%就没有参考高度,于是也就导致div的百分比高度无效,如果将css代码中的第一行设置为:

div的100%是从其上一级div的宽高继承来的,有一点很关键,就是要设置div100%显示,必须设置其上一级div的宽度或高度,否则无效。

前面总得有个容器说明他的高度是多少。这样的话div才能按比例100%继承上一级的高度可惜的是浏览器一般默认解释为内容的高度,而不是100%。

解决方法:只要为html和body设置高度为100%就可以了,html,body{height:100%},这样之后div会按比例来继承上一级的高度了.仅仅设置的div元素的height属性貌似没有什么效果。

另外,html{height:100%}的高度是相对浏览器高度来说的。

1、首先打开html5编辑器,新建一个html文件,在里面写入一个button按钮,被button按钮设置一个样式,这里给它的class属性设置为btn:

2、在上方引入style标签,在里面设置btn类的样式,这里设置宽度和高度使用width和height属性就可以了,最后在美化一下按钮,设置背景色和字体颜色以及文字橘子效果:

3、最后打开浏览器,即可看到设置好的按钮了。以上就是html5中设置按钮的宽度和高度的方法: