body高度100%,三个image高度分别为auto,50%,60%,imge高度为当时body高度的百分比,auto时为原始高度
html代码如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <style> html {height:100%;} body {height:100%;} <!-- auto 图片原始多少就多少--> img.normal {height:auto;} <!-- 相对于body高度的50%--> img.big {height:50%;} <!-- 相对于body高度的10%--> img.small {height:10%;} </style> </head> <body> <!-- width="95" height="84"无效--> <img class="normal" src="logocss.gif" width="95" height="84" /><br> <img class="big" src="logocss.gif" width="95" height="84" /><br> <img class="small" src="logocss.gif" width="95" height="84" /> </body> </html>
运行结果