CSS+DIV 的宽度和高度的自适应问题_html/css_WEB-ITnose
- WBOY原创
- 2016-06-21 09:44:22857浏览
CSS HTML 布局 相对定位
除了body以外，最外层的width:80%和height:80%都设置了百分比为什么没有占屏幕的80%呢？<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style type="text/css"> .div1{ width:80%; height:80%; background:blue; border:1px solid black; } .test{ width:80%; height:80%; background:red; border:1px solid yellow; } </style><title>流体定位布局2</title></head><body><div class="div1"> this is a test <div class="test"> this is a second test </div> aaaa </div></body></html> 于是，我试着进行修改，如果把width:80%修改成width:500px;相应的比例就可以生效。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style type="text/css"> .div1{ width:80%; height:500px; background:blue; border:1px solid black; } .test{ width:80%; height:80%; background:red; border:1px solid yellow; } </style><title>流体定位布局2</title></head><body><div class="div1"> this is a test <div class="test"> this is a second test </div> aaaa </div></body></html> 但是，如果只修改height:80%修改为height:500px;仍然不能占到相应的比例
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style type="text/css"> .div1{ width:500px; height:80%; background:blue; border:1px solid black; } .test{ width:80%; height:80%; background:red; border:1px solid yellow; } </style><title>流体定位布局2</title></head><body><div class="div1"> this is a test <div class="test"> this is a second test </div> aaaa </div></body></html> 有木有大神，能够解释下，谢啦~
回复讨论(解决方案)
可能原因：
1.没有给body定义宽度和高度，无法得到是谁的80%.
2.非标准html不识别百分比，标准的是xhtml.
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn