整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
篇文章我們要說的就是這html中運用也是使用最多的標簽div，我們接下來重點介紹下div的作用，以及如何給div合理的命名，讓代碼結構更加清晰明了。
使用語法：<div>元素內容</div>
在網頁制作過程過中，我們可以把一些獨立的邏輯部分劃分出來，放在一個<div>標簽中，這個<div>標簽的作用就相當于一個容器。容器的作用呢就是可以把一個邏輯部分包裹起來存到元素內部。
確定邏輯部分：
什么是邏輯部分？它是頁面上相互關聯的一組元素。如網頁中的獨立的欄目版塊，就是一個典型的邏輯部分。比如網頁中的頭部模塊、banner模塊、新聞列表模塊等，這樣的部分就可以使用div標簽作為容器存放進去。如下圖所示：圖中用紅色邊框標出的部分就是一個邏輯部分，就可以使用<div>標簽作為容器。
第一條我們講到把一些標簽放進<div>里，劃分出一個獨立的邏輯部分。為了使邏輯更加清晰，我們可以為這一個獨立的邏輯部分設置一個名稱，用id屬性來為<div>提供唯一的名稱，這個就像我們每個人都有一個身份證號，這個身份證號是唯一標識我們的身份的，也是必須唯一的。對于重復的邏輯部分我們用class屬性來為div添加一個通用名稱，class不唯一可以重復使用。
上邊這張圖片左邊是沒有使用div的排版，我們可以看到整個頁面標簽有很多，我們很難區分哪一塊是一個部分的，哪一塊是屬于哪個區域的，但是右邊這張圖片，我們使用div包括了之后我們就可以很清晰的了解到，每一個模塊屬于哪部分，結構排版也顯得很明了，便于我們后期的修改和維護。
到這本節課的內容我們就說完了，快點自己動手來試試：給網頁的獨立的版塊添加“標記”。
附贈一句經典語錄：將來的你一定會感謝現在奮斗的自己！喜歡我的文章的小伙伴記得關注一下哦，每天將為你更新最新知識。
、這里是最簡單的div+css，div+css在前端開發中有什么用參看我發的文【105】。
這里我用div+css做一個有顏色的盒子，瀏覽器運行后如下圖。
圖1
二、我用的開發工具是Sublime Text，代碼如下：
圖2
SS是樣式,DIV是層.DIV+CSS是網站標準（web標準），通常為了說明與HTML網頁設計語言中的表格（table）定位方式的區別.因為XHTML網站設計標準中，不再使用表格定位技術，而是采用DIV+CSS的方式實現各種定位。
看得懂HTML語法，那么世界上80%的網站都能被你看穿。HTML語言很好學，一定要熟記常用的一些代碼，因為有了像dreamweaver這樣的幫助生成html代碼的工具,所以很多人都忽略了HTML的學習.學會了HTML互聯網中最基本的語言之后，在學習DIV+CSS時，你會發現：原來DIV+CSS也就那樣，小菜一碟。現在都是用Notepad++、Sublime等，我這篇文章主要寫的用Dw。
對于網頁設計初學者來說，直接使用記事本、Notepad等工具來書寫代碼很困難。因為Dreamweaver的代碼模式有提示功能，可以在保證語法編寫的正確性。并且對不熟悉的語法可以一次性書寫正確。
如圖所示：書寫div，html時DW的提供功能。
書寫CSS時DW工具欄右側的CSS可視化編輯功能.
談談如何從零開始學習DIVCSS
我學習DIV+CSS時就是從Dreamweaver的代碼模式學起的，也許不是最好，但很實用。
有良好的生活習慣，說明這人會過日子，有良好的CSS書寫習慣，說明這人做事嚴謹。寫css的時候網上有很多推薦的規范，比如菜單類用menu，版權用copyright（CoryRight），底部用footer等等，在書寫順序上一般是：顯示屬性-自身屬性-文本屬性。當然這些都沒有硬性的規定，但是遵循一些不成文的規定不是壞事，這樣讓自己寫的代碼，容易讓別人讀懂，搜索引擎也更加喜歡。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
