1.
html{background-color:white;}瀏覽器能看到的所有范圍 ,不包括邊框
body{background-color:green;}與htm一樣,瀏覽器能看到的所有訪問但無像html一樣包括邊框,級別html>body
如:
<!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>
<style>
html{
background-color:red;
}
body{
background-color:blue;
}
.div1{
background-color:green;
width:222px;
height:440px;
}
</style>
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
</body>
</html>
效果圖:

由於后面樣式替換前面寫過的樣式,所以div1就由html賦予的藍色轉變成了綠色了
2.margin:0;清除外邊距屬性, border:44px;設置邊框,主要設置與表格
<!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>
<style>
/*
* html所包含的區域內填充紅色 ====包含body內容
*/
html{
background-color:red;
}
/*
* body所包含的區填充藍色,此句顏色覆蓋紅色轉變為藍色
* margin:0表示body與html存在外邊距屬性margin,設置為0相當與清除與 html外邊距屬性且body外邊距屬性也會清除掉
*/
body{
background-color:blue;
margin:0;
}
/*
* body所包含的區填充藍色,此句顏色覆蓋html覆蓋的body紅色內容
* border:44px;設置邊框,主要設置與表格
*/
.div1{
background-color:green;
width:222px;
height:440px;
border: 44px;
border-color:#FFFFFF;
}
</style>
</head>
<body>
<div class="div1">
<table border="">
<tr>
<td>fdfafaf</td>
<td>fdfafaf</td>
<td>fdfafaf</td>
</tr>
</table>
</div>
<div class="div2"></div>
</body>
</html>
效果圖:

