學(xué)習(xí)DIV CSS需要掌握哪些知識(shí)？如何學(xué)習(xí)DIV CSS
CSS其實(shí)是HTML和CSS的組合，所謂DIV只是為了與以前流行的表格網(wǎng)頁(yè)區(qū)分開(kāi)來(lái)。相比于表格網(wǎng)頁(yè)，DIV CSS更具層次感，修改也更加容易。如果不想動(dòng)一格表格網(wǎng)頁(yè)，可能需要重新調(diào)整整個(gè)頁(yè)面。那么，學(xué)
CSS其實(shí)是HTML和CSS的組合，所謂DIV只是為了與以前流行的表格網(wǎng)頁(yè)區(qū)分開(kāi)來(lái)。相比于表格網(wǎng)頁(yè)，DIV CSS更具層次感，修改也更加容易。如果不想動(dòng)一格表格網(wǎng)頁(yè)，可能需要重新調(diào)整整個(gè)頁(yè)面。那么，學(xué)習(xí)DIV CSS需要掌握哪些知識(shí)呢？新手又該如何進(jìn)行學(xué)習(xí)呢？本文將分享一些我自己的學(xué)習(xí)經(jīng)驗(yàn)。
1. 學(xué)習(xí)HTML基礎(chǔ)知識(shí)
為了能夠系統(tǒng)地學(xué)習(xí)DIV CSS，建議新手先學(xué)習(xí)一些HTML的基礎(chǔ)知識(shí)。推薦參考W3C的教程。在這部分學(xué)習(xí)中，你需要掌握HTML的基本標(biāo)簽、HTML的書寫格式等。例如，一個(gè)HTML頁(yè)面的構(gòu)成肯定會(huì)包含lt;headgt;和lt;bodygt;，還有標(biāo)題等等。在頁(yè)面中的標(biāo)簽都是成對(duì)存在的。想要更詳細(xì)地了解，請(qǐng)到W3C進(jìn)行系統(tǒng)學(xué)習(xí)。
2. 用表格進(jìn)行簡(jiǎn)單的網(wǎng)頁(yè)制作
一旦掌握了基礎(chǔ)知識(shí)，你就可以使用表格進(jìn)行簡(jiǎn)單的網(wǎng)頁(yè)制作了。這也是正式開(kāi)始學(xué)習(xí)DIV CSS的一部分內(nèi)容。學(xué)習(xí)CSS最關(guān)鍵的是要明白CSS的作用是什么，只有理解了才能舉一反三，才能在其他地方靈活運(yùn)用。CSS是層疊樣式表的縮寫，直觀地理解就是一層一層的樣式疊加在一起，放在一個(gè)文件中。CSS可以控制網(wǎng)頁(yè)中圖片、文字、視頻、表格等元素的位置和樣式。我們只需要學(xué)習(xí)一些常用的屬性，不常用的可以隨時(shí)查資料。如圖所示，樣式表單獨(dú)放在HTML之外，這樣方便修改。
3. 掌握CSS的基礎(chǔ)控制
以文字為例，CSS可以控制大小、字體、顏色、粗體、斜體等；對(duì)于圖片，可以控制對(duì)齊方式等；而對(duì)于DIV，則可以控制外邊距、內(nèi)邊距、邊框的大小、顏色、樣式等等。這些都是CSS的基礎(chǔ)內(nèi)容，需要重點(diǎn)學(xué)習(xí)并熟記。
4. 學(xué)習(xí)CSS定位
當(dāng)你掌握了基礎(chǔ)的控制，還需要學(xué)習(xí)一個(gè)重點(diǎn)，即定位。CSS的定位決定了網(wǎng)頁(yè)中各個(gè)元素的位置，從而決定了用戶看到的網(wǎng)頁(yè)是什么樣式。學(xué)習(xí)定位，最重要的是需要理解margin和padding的區(qū)別，以及較難的絕對(duì)定位和相對(duì)定位。
5. 熟悉CSS選擇器
CSS選擇器也是學(xué)習(xí)CSS的重點(diǎn)內(nèi)容，不同的選擇器具有不同的優(yōu)先級(jí)，應(yīng)用也有所區(qū)別。這部分內(nèi)容是學(xué)習(xí)的難點(diǎn)，但也是必須掌握的。只有熟練運(yùn)用CSS選擇器，才能對(duì)HTML頁(yè)面中的元素進(jìn)行一對(duì)一、一對(duì)多或多對(duì)一的控制。
6. 深入學(xué)習(xí)CSS高級(jí)應(yīng)用和CSS3
通過(guò)學(xué)習(xí)前面的內(nèi)容，你已經(jīng)基本可以應(yīng)付大部分的網(wǎng)頁(yè)制作了。然而，CSS還有一些高級(jí)內(nèi)容值得深入學(xué)習(xí)，例如CSS動(dòng)畫。使用CSS動(dòng)畫可以為網(wǎng)頁(yè)添加更豐富的交互效果。盡管由于兼容性的原因，CSS3在目前還沒(méi)有得到普及，但我相信它很快就會(huì)被所有瀏覽器支持。因此，我們也需要掌握CSS3的相關(guān)知識(shí)。如果對(duì)CSS動(dòng)畫感興趣，可以根據(jù)圖片中的內(nèi)容在百度上搜索相關(guān)教程。
7. 總結(jié)
以上是對(duì)CSS內(nèi)容的主要總結(jié)，但要學(xué)習(xí)好它并不是一天兩天的事。希望有意學(xué)習(xí)的同學(xué)能夠認(rèn)真學(xué)習(xí)，W3C的教程足夠參考。