如何從零開始學習DIV+CSS
，而是采用DIV+CSS的方式實現各種定位。
1：學會HTML語言，再學習DIV+CSS時會得心應手。
看得懂HTML語法，那么世界上80%的網站都能被你看穿。HTML語言很好學，一定要熟記常用的一些代碼，因為有了像dreamweaver這樣的幫助生成html代碼的工具,所以很多人都忽略了HTML的學習.學會了HTML互聯網中最基本的語言之后，在學習DIV+CSS時，你會發現：原來DIV+CSS也就那樣，小菜一碟。
2.使用Dreamweaver的代碼模式來編寫DIV和CSS。
對于網頁設計初學者來說，直接使用記事本、Notepad等工具來書寫代碼很困難。因為Dreamweaver的代碼模式有提示功能，可以在保證語法編寫的正確性。并且對不熟悉的語法可以一次性書寫正確。
如圖所示：書寫div，html時DW的提供功能。
書寫CSS時DW工具欄右側的CSS可視化編輯功能.
我學習DIV+CSS時就是從Dreamweaver的代碼模式學起的，也許不是最好，但很實用。
3：養成良好的書寫習慣.
有良好的生活習慣，說明這人會過日子，有良好的CSS書寫習慣，說明這人做事嚴謹。寫css的時候網上有很多推薦的規范，比如菜單類用menu，版權用copyright（CoryRight），底部用footer等等，在書寫順序上一般是：顯示屬性-自身屬性-文本屬性。當然這些都沒有硬性的規定，但是遵循一些不成文的規定不是壞事，這樣讓自己寫的代碼，容易讓別人讀懂，搜索引擎也更加喜歡。
4：只有目的明確，結果清晰，過程才最高效，才不會輕易被干擾，被改變方向。
怎么學習div+css,有什么好的方法推薦。什么都不懂，初學
1、學習一下基本知識。包括html基本知識，然后再學習一下CSS基本語法。（兩天）
2、實踐開始，在網上搜索div+css教程，有一個十天學會div+css，寫的比較全面，內容層次性強。你就把這十個課程的內容邊學邊做，體會網頁制作基本過程。（五天）
3、高手必經之路，模仿制作。下載個火狐瀏覽器，安裝firebug，它是網頁設計最好用的瀏覽器。剛開始，你可以打開一個簡單的企業網站，企業網站初學者模仿容易上手。你可以按F12，查看它的頁面構成，包裹每個div都可以詳細顯示。看別人是如何用css+div布局的，然后自己按著別人的套路試試，看能不能實現。（一個月）
4、如果第三步模仿了兩個網站之后，你就可以自己去下載個psd網頁圖片，然后自己切片，再通過div+css把它們擺出來試試。途中也許會遇到很多問題，包括切片，js特效，瀏覽器不兼容等。但是慢慢解決，就一定可以的。（一個月）
學習div+css三條建議：1、盡量別用試圖設計，用代碼手寫，可以極大制作提高速度。
2、遇到問題，不會解答，多問別人，很多都是當局者迷旁觀者清，你所遇到的問題高手很定都遇到過。
3、勤動手，堅持兩個月，你就成為了高手。
div+css如何布局頭部導航條！
1、新建一個html頁面。
2、在html頁面上新建三個div標簽，分別為這三個div添加class為:header、main、footer。
3、創建style標簽用于設置css樣式。在title標簽下創建一個style標簽，然后為header類設置div的高、背景顏色樣式。
4、為顯示主要內容的main類設置樣式。在style標簽里設置main類樣式的邊框、寬、高、背景顏色。
5、設置底部footer的樣式。在style標簽里添加footer類樣式的背景顏色和高度。
6、保存好html文件后使用瀏覽器查看效果。
7、在瀏覽器上看到div標簽和瀏覽器存在一些空白的像素，為了去掉這些空白的像素我們需要把body標簽設置外邊框。
DIV+CSS教程
<!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; chart=gb2312" />
<title>無標題文檔</title>
<link rel="stylesheet" href="Untitled-3.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="header">網頁導航欄</div>
<div id="pagebody">
<div id="sidebar">分欄一</div>
<div id="mainbody">分欄二</div>
</div>
<div id="footer">網頁尾部</div>
</div>
</body>
</html>
以上代碼不用我多說吧？其中有一個注意點就是 <link rel="stylesheet" href="Untitled-3.css" type="text/css" />這是用來鏈接外部樣式表的，而這段代碼要放在<head></head>之間；
（新建一個HTML文檔，把以上代碼復制下來，然后粘貼到新建的HTML文檔中的<body></body>之間）這里一共用到了七個ID，下面我將CSS樣式表再傳上來，然后就樣式表中的一些相關屬性再一一細說！！！！！！
！
！
！
！
新建一個文檔，把后輟改為.css，然后把以下代碼復制到.CSS樣式表中即可；
下面來詳細說說其中代碼的起到的功能；由于為了讓你看的明白，加了顏色，色彩搭配上不是很合適，不好意思了！！！！
body{
margin:0px;
padding:0px;
font-size:12px;
text-align:center;
background-color:#999999;
}
/*body是頁面整體布局的設置，參數margin是外部邊的樣式；他的順序是：上－右－下－左； 參數padding是內邊的樣式，順序與margin是一樣的；font-size是字體大小;參數text-align是內容位置，center是居中顯示，還有其它參數可供選擇，這里就不一一詳述。參數background-color是背景顏色*/
a:link {
color: #CC9900;
}
a:visited {
color: #0000FF;
}
a:hover {
color: #009900;
}
a:active {
color: #FF0000;
}
/*以上是鏈接樣式 */
#container{
width:800px;
height:500px;
background-color:#0099FF;
}
/*以上是總體DIV的樣式，其中屬性：width是寬；height是高；background-color是背景色；以后樣式中屬性值相同處不再復述。明白嗎？呵呵*/
#header{
width:750px;
height:100px;
background-color:#FF6600;
}
/*以上的代碼是你要的導航頭部*/
#pagebody{
width:690px;
height:240px;
background-color:#339933;
margin:10px;
padding:20px;
}
/*以上這段代碼是信息主要區域了，新聞呀！！！商品呀！！！！圖片呀！！！主要的都在這里面寫了*/
#footer{
width:750px;
height:100px;
background-color:#996600;
}
/*以上這段代碼就是你要的結尾了！*/
#sidebar{
width:350px;
height:250px;
float:left;
background-color:#FF0000;
}
#mainbody{
width:340px;
height:250px;
float:right;
background-color:#FF00FF;
}
/*以上兩段代碼是為了讓你看明白怎么加入主區域內的分欄而寫，其中有一個參數要特別說一下，那就是float這個屬性了，它是讓#sidebar與#mainbody這兩個ID一個靠左一個靠右，如果不這樣設置的話，那么這兩個ID就會擠在一起了。明白了嗎？*/
不清楚之處請告訴我，我再詳細解答給你！
好好學吧！只要持之以恒就一定會學會的！剛開始的時候是有些摸不著頭腦，多看資料，多看書 多做練習，第一遍看不懂是正常的，第二遍如果還看不懂也沒關系，一直看下去，只到看懂為止，古人云：書讀萬遍其意自現呀！呵呵，這些都是題外話，有點MJ了，呵呵！！！不要只看不練習，那樣看多少都是徒勞的！一定要練習，多練習；正所謂，熟能生巧。
貼子就寫到這里了。共同學習，一起進步吧！！！！
div+css要怎么學？
首先，要看一些html和css手冊的，要明白html里的基礎標簽，知道css里具體的屬性是做什么的。其次，找一些經典的網站，小站就可以，看看人家是怎么一個個控制的，也要聽一些視頻。第三，自己動手開始寫一些，這時肯定會出現問題，你就要一個個的解決問題，兼容性問題很常見，網上也有總結的調兼容性的方法，照著做一下，慢慢就可以了。我就是這么學的，希望對你有幫助。。
DIV+CSS技術如何入門
CSS是Cascading Style Sheets（層疊樣式表單）的簡稱。更多的人把它稱作樣式表。顧名思義，它是一種設計網頁樣式的工具。借助CSS的強大功能，網頁將在您豐富的想象力下千變萬化，越來越多的人在學習而很多初學者沒有一個頭緒，整理了一些學習的方法給大家。
一. CSS學習重在方法!
學習任何東西都是一樣，從小學、中學、大學，除了學習知識外就是去學習方法!
要想掌握CSS, 首先要學會HTML!
再來談一下學習過程中的細節，因為一個樣式它是不可能脫離HTML頁面的，HTML不與樣式結合的話, CSS就失去了存在的意義。所以一般書中都會舉一個例子，然后讓你上機測試效果，這是筆者想讓你有對樣式表CSS有一個初步的印象，告訴你CSS能做什么。一個小例子：“麻雀雖小，五臟俱全”，你可能看不懂每一個語句的真正意思。但是你可以記得例子的模式，以后在實踐中不斷地用，不斷用的過程就是不斷記的過程，所以不能恢心，不能總認為自己記憶力不好，但不管你騎的是牛也好，千里馬也罷，只要有恒心，一定會到達終點的。
閱讀一本書，一般來說第一次要先把整個書通讀一遍，不理解的也要往下看，在往下看的過程中你也許會找到那個問題的答案。看完后你有一個大概的印象，但一定有很多不明白的地方，沒關系，繼續往下看。第二遍你就要邊看邊做學習筆記了，把你認為是重點的部分寫上，還有，你覺得有疑問的部分也要記下，帶著疑問看下去，如果沒有答案，你可以去BBS上發一個貼子，好心人還是很多的，提示一句：“一定要學會如何去問問題!” 。你還要上機去練習書上的例子，最讓你困惑的：“一是記不住，二是對概念的理解有誤(這一條可能是書譯的不好，另外就是你的理解不對)”，對于第一條你就要樹立信心，堅持再堅持下去。當你到達終點時你回發現一切都是順理成章的事。因為你努力了，努力了就會有回報，有結果。
有好多人也看了，但是沒有什么進步，主要有以下幾個原因：
原因一：壓力不夠，因為有不少人比如美工學CSS，因為是看別人學，所以學之，不學就沒優勢!這樣的壓力是很小的，學不好還有美工這碗飯。
原因二：只是業余學習，這樣學還只是玩一玩，因為你不一定非要以這門技術吃飯。
原因三：方法不對，有的人只是在看教程，但他不動手去做，我以前就是看的太多，做的太少，所以有了實踐你才能把理論的東西揉進去。
二. 掌握CSS的四個學習階段
階段一：不去想瀏覽器的兼容性問題的情況下能做出頁面，但頁面里到處用TABLE的 模式DIV寫出的頁面。
階段二：想到了兼容性問題，但無法提前預防，只會修補問題，大量使用HACK技術(我對HACK技術只是知道，但用的很少)
階段三：可提前預防BUG，但樣式表中大量應用了ID,CLASS，CSS譯過來是重疊樣式表，比如“DIV P SPAN”。這句代碼是標明DIV子元素中P的子元素SPAN，這樣寫就可以定義SPAN的樣式了，不用在SPAN中加入CLASS了。這也就是CSS的優點所在，為什么不好好利用而一定要定義一個CLASS呢!
階段四：這一階段是最難的，良好的HTML語義結構、合理的CSS、可重復利用的樣式。良好的語義有這方面的文章,合理的CSS，這兩方面以后一定會寫專題來研究。
三. CSS初學者常見問題：
第一個要求是縮圖的正下方要有個標題。作法相當直接了當：在你的 HTML 里放上圖片，接著一個斷行 (BR)，再把標題放在一個段落 (P) 里并且置中 (利用 CSS)。
接著要讓這些縮圖跟標題成對地排列在瀏覽器窗口里。使用表格排版時，這一對對的縮圖跟標題會被分別放置在 TD 里。在使用 CSS 排版時，我們要把它們分別放置在 DIV 里。為了讓它們能水平排列在窗口上，我們用 CSS 讓這些 DIV 往左浮動 (FLOAT)。
問題1：學CSS應該選什么樣書來讀?
先推薦幾本：《CSS權威指南》《網站重構》《網站布局實錄》《HTML參考大全》
問題2：用什么軟件編輯CSS代碼?
只要已經能達到會手寫的程度，用什么軟件都可以，推薦使用DreamWeaver外掛TopStyle(最新版本是Pro V3.12)。
問題3：先寫HTML還是先寫CSS?
網上有很多種答案：先寫HTML后寫CSS;先寫CSS后寫HTML;兩者同時寫。兩者一起寫更適合初學者，先寫CSS或者先寫HTML對于初學者都不是恰當得的方法。如果讓一個人編寫代碼，你告訴他先寫HTML,寫完后 HTML不能修改了，然后你寫CSS，如果他可以寫出來，那這個人一定是一個水平非常高的Builder了!所以對于初學者，多數情況下建議同時編寫，具體說一下步驟：
先要把站點建好，目錄建好，比如我們建好文件夾CSS,IMAGES,這兩個是最其本的，然后新建一個HTML文件，一個style.css一個空 的樣式表，把HTML頁連接到這個外部樣式表。
然后我們先寫HTML中的最基本的布局部分，都是用DIV，然后直接在DIV里加入ID或CLASS，這些 布局部分包括外套部分，頭部分，中間部分，左，中，右，版權部分等。
寫好這些后，這時你可以到樣式表中寫樣式，或者你在接著寫布局里的部分，拿頭部為例，在頭部寫入LOGO部分，NAV部分也同樣加入ID或CLASS。其它同理。
為什么說我們不可能一次性把HTML部分寫好呢，因為人都是可能犯錯誤的，可能你的想法寫的過程就是有問題的，或者為了瀏覽器的兼容性問題，有些是你由于經驗的不足沒有提前預料到的，所以當你寫樣式時發現了問題時就有可能要改動你的HTML的代碼。大至的寫法就是這樣，你也可以HTML/CSS同時進行，都是可以的，看你的習慣。我們寫代碼時很多時候是邊寫代碼邊測試，也不是說寫一句測試一句，而是寫了一段代碼后就進行瀏覽器的測試，一個優秀的制作師他們的代碼多數情況寫了很多時他們才測試一下，是因為一個人如果經驗多的話，他們就會知道并提前預防瀏覽器錯誤顯示的發生了!所以他們寫代碼的速度比沒有經驗的人快。他們已經經歷過了你所要經歷的錯誤，你第一次遇到錯誤的瀏覽器顯示問題你要花時間去修補，而他們可提前防止或遇到了可立即解決問題!這就是你與他們的不同點之一。
初學者與高手不同點之處還有一個就是高手們使用了大量的快捷鍵，所以一定要記住那些常用的快捷鍵，每一個小的細節都有一點提高，綜合在一起就是很大的提高。
另外提高自己的水平最好的方法就是多實踐，多找一些比較好的HTML+CSS的模板進行編碼實踐，開始時要選一個簡單點的，把頁面截圖，然后把這張圖用自己的想法還原成HTML頁面……
http://cnmaple.cn
