DIV是html標記，通常作為容納其他元素的容器，當DIV以絕對定位方式定位時，可以視為“層”DIV是W3CHTML的標準元素。
使用DIV標簽
使用CSS－P，主要依靠<div>標簽來實現，當你把HTML內容放在<div>標簽里時，可以稱它為:“DIV塊”,“DIV元素”,“CSS-layer”,或者簡單的稱之為“layer”。
使用DIV標簽的方法和其他標簽沒有什么兩樣：
<div>
HTML內容
</div>
純粹使用<DIV>標簽而不加任何CSS內容，其效果與用<P></P>是一樣的。
但當把CSS放進DIV標簽中以后，我們就可以指定HMTL元素顯示在屏幕上的具體位置，可以在某一位置上畫出方形或線，或者指定文字在某一個塊中如何顯示。首先要做的，是給這個DIV元素（即層）加上一個唯一的ID標識（ID的作用類似于為這個層起個名字）。
<divid="abc">
加一個ID號
</div>
層的ID可以隨意設定，可由字母、數字和下劃線組成，但必須以字母起頭
div是html中的一個標簽，通常情況下作為一個容器來容納其它元素，在css中表示一種選擇器；可以直接通過div（標簽選擇器）來查找對應的元素并設置其樣式；如果是.div那就表示是類名選擇器；是設置類名是div的元素來設置相關樣式；在pc端頁面中 使用的最多；
新建一個html網頁，在body中插入【<div class="content"></div>】并引入CSS【.content{width: 420px;height: 100px;background: #d4d4d4;padding: 5px 0 5px 5px;}】。
在大DIV中插入一個DIV【<div class="a"></div>】并引入CSS【.a{width: 100px;height: 100px;margin-right: 5px;background: #ff0000;}】定義它的高，寬，外邊距，背景色。
繼續添加一個同級的DIV【<div class="a b"></div>】并引入樣式a和樣式b，樣式B只定義背景色【.b{background: #FF5F00;}】。可以看到第2個DIV排到了第一個的下方位置。
按照同樣的方法再添加2個同級的DIV并引入不同顏色的DIV【<div class="a c"></div><div class="a d"></div>】。然后引入CSS【.c{background: #FFED00;}.d{background: #00FF93;}】。刷新后可以看到預覽效果是4個IDV垂直排列的，怎么能讓他們水平排列在一行呢？
為了方便朋友們查看順序，把4個DIV分別插入一個數字，相當于給他們編一個號碼。
接下來就要用到浮動代碼了。在4個DIV共用的a樣式中，加入左浮動【float: left;】。保存并刷新網頁可以看到已經都在一行上了，而且是按照編碼順序從左到右排列的。
我們再來試一下右浮動【float:right】，可以看到DIV是從右向左排列的。現在朋友們知道怎么使用浮動代碼了嗎？
1.打開Dreamweaver 8，分別新建html和css格式的文件，分別存放在桌面web文件夾中的根目錄和CSS文件夾中。
2.在首頁index.html中為系統標簽，因此在index.css文件中定義，語句表達方式為：body{ background:#4B7E9B; padding:0; margin:0;}，body標簽與其它標簽類似，其內部編程方式為：命令（如background），參數（如#4B7E9B（顏色代碼）），上述語句的釋義為：首頁的背景顏色為#4B7E9B，填充為0，間距為0。
首頁index.html文件中調用剛才定義好的body標簽，語句表達方式為：<link href="css/index.css" rel="stylesheet" type="text/css" />
3.其它自己定義標簽名稱的標簽為引用標簽，它們的定義和調用方式與系統標簽不同。某個引用標簽語句表達方式為： .TOP1{ width:960px; height:30px; background:url(file:///D|/Users/ZhangZhaoJian/Desktop/web/images/topbg.gif) left repeat; float:left;}，
特別注意，TOP1為你自己定義的標簽名稱，為引用標簽，為了與系統標簽區別，在TOP1的前面有個 . 或 # ，在這里為 .TOP1。而標簽內的語句編程方式與系統標簽相同，上述語句的釋義為：導航條的寬度為960像素，高度為30像素，背景是圖片鏈接，向左填充。
4.首頁index.html文件中調用剛才定義好的.TOP1標簽，語句表達方式為：<div class="TOP1"> </div>