CSS 的學習重點

Jun 2 2006

web

CSS @ flickr

CSS(Cascading Style Sheet)對我來說,最重要的莫過於它在「排版」上的能力了,而這同時也是它最難搞懂,或是很容易一知半解(我的現狀就是如此)的地方…

一兩個月前,買了兩本與 CSS 相關的書籍,想說這樣一來,就沒啥藉口偷懶了,但後來我發覺,我似乎少買了一本書,或甚至只是一個章節,一個仔細討論與解說 CSS 中幾個我常常會忘了或是一知半解的章節。因此我只好繼續偷懶,偶爾看一點書,興起時就拿這個 drake.csie.org 網站做實驗,完全沒啥長進,有時甚至會自我嘲解「真的要學 CSS 嗎? 3D 的東西都學不完了,確定還有腦子可能應付這一塊東西? 而且萬一學得一知半解,但卻剛好唬住身邊的人,他們因此把寫網頁這塊重擔放在你身上,那還真是害死人了…」

如今我把網頁撰寫這一塊當作一種娛樂,就像以前看待「寫 3D 程式」這件事一樣,無聊時就打開文字編輯器,上上網查一下有什麼新技術或玩意兒,然後也許是拿別人的程式過來改寫看看,或是從頭到腳自己玩一下。

今天突然心血來潮(因為是娛樂嘛),於是 google 了一下「css position」,找到這一篇,相當的喜愛,一口氣把它整個看完了,而且只花了我十分鐘就搞定。一開頭的「HTML發展的瓶頸」與「HTML的回歸本質」,看起來相當愉快,而且簡短地把歷史演變過程描述出來(沒有考究過,所以不是很確定是否有誤,存 1% 的疑好了)。接著的「從Web標準計畫看CSS」詳列了各種標準的官方參考網頁,非常的有價值。但是最讓我興奮的還是「CSS學習重點」,說到我的心坎裏去了:

  • 充分瞭解CSS的box model
  • 充分瞭解CSS的float屬性
  • 充分瞭解CSS的position屬性
  • 裝飾用的圖片以背景圖片取代,主要圖片才使用img標籤
  • 以CSS作版面配置取代使用table 版面配置
  • 使用CSS的ID功能取代html的頁框功能

私自認為,對於一位學習程式語言沒有任何障礙的程式設計師來說,學習 CSS 的最重要關鍵就是上述的幾點,那些 CSS 的語法,有什麼 property,每個 property 有哪些可以用的參數,又各家 browser 的支援程式,都是可以信手捻來或買本書就查得到的東西,唯有 CSS 中有關「排版」的這一部分的概念,卻是需要深入了解也是學 CSS 的第一難關吧。

特別寫下這篇「CSS 的學習重點」,感謝原作者(好像還在繼續更新頁面)的無私貢獻了這一份整理好的心得出來。

comments powered by Disqus