Css 定位Div的不同方式
margin方式定位Div:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title></head><style type="text/css">.a1,.b1,.c1{background-color:#aaa;margin:5px;}.a1{ height:50px;width:100px;}.b1{ height:50px; width:100px;}.c1{ margin-top:-110px; margin-left:110px; height:105px;}</style><body> <div >a1</div> <div name="code"><!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>position</title><style type="text/css">body{position:relative;}#leftTop{width:100px; height:200px; background-color:#CCCCCC; position:absolute;left:0;top:0;}#leftBottom{width:100px; height:150px; background-color:#CCCCCC;margin-top:210px;float:left; }#box{width:400px; margin-left:10px; height:360px; background-color:#CCCCCC;float:left;}</style><style xml:base="/C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/" type="text/css" id="webdeveloper-edit-css-style-0">body{position:relative;}#leftTop, #leftBottom, #box {background-color: #CCCCCC;}#leftTop{ width:100px; height:200px; position:absolute;left:0;top:0;}#leftBottom{width:100px; height:200px; margin-top:210px;float:left; }#box{width:800px; margin-left:10px; height:410px; float:left;}</style></head><body><div id="leftTop"></div><div id="leftBottom"></div><div id="box"></div></body></html><!DOCTYPE html PUBLIC"-//qq8697865//史诺比//ZH" "http://www.w3c.org/tr/html4/strict.dtd"><html><head><title></title><style type="text/css">*{padding:0px auto;margin:0px auto;}.a1,.a2,.a3{background-color:#aaa;margin:5px;}.a1{width:20%;height:200px;float:left}.a2{width:77%;height:310px;float:right}.a3{width:20%;height:100px;float:left}</style></head><body><div class="a1"></div><div class="a2"></div><div class="a3"></div></body></html>