skip to main content

甚麼是CSS?CSS有甚麼作用?為甚麼網頁需要CSS?

於2020年11月13日更新


CSS是甚麼?有甚麼作用?

CSS全寫叫Cascading Style Sheets

CSS的第二個英文字是Style,這字正正講出了CSS是用來做甚麼的,就是設計,Design方面的工作

在我教別人做網頁時候,我常常用一個房子來比喻的。網頁的HTML部份充當起網頁支架/外牆(如果真是不知道HTML是甚麼的話可以參考這篇),CSS則是一位室內設計師負責起這家房子的設計工作

CSS有多重要?

沒有裝修的房子

你如果試過搬家,搬的是全新房子的話,在還沒有裝修或者任何設計之前,房子看起來只有四面牆,或者只是有一些簡單的家具設備,沒甚麼特別

沒有裝修的房子

但是如果你花個幾百萬去請個室內設計師都攪個裝修的話,那你房子可以突然變得很豪華,看起來本來可能只值五百萬的房,現在可能值個一千萬了。

在做網站時有類似的情況,如果我們只用HTML去做網頁,而不用CSS去做裝修設計的話,雖然網站還是能用的,但是網站的外觀上會看起來很原始,跟還沒有裝修前的房子一樣,一點都不專業,也沒有美感可言

以我這個網站的首頁為例,你可以比較下有CSS,和沒有CSS的情況下的分別

這是有CSS
有CSS的網頁效果 這是沒有CSS
沒有CSS的網頁效果

你可以明顯看出上面兩張圖有和沒有加CSS的網頁在外觀,排版,顏色各方面簡直是差天共地,相信這已充夠讓你明白CSS的重要性和用途。

為甚麼CSS和HTML常常會被放在一齊?

因為CSS的作用是幫助HTML去攪裝修設計的,所以如果你想學一學CSS前,一定要先學HTML,也是為甚麼你會看到坊間幾乎所有的網站開發課程都是寫著"HTML + CSS入門",兩者幾乎在學習寫網站的過程中是個連體嬰一樣,不可分割。

希望經過這次你能對CSS是甚麼增加了點理解。如果你有興趣想學點HTML和CSS的入門知識的話,我製作了一個免費的HTML + CSS基礎課程,你可以去看看,謝謝你這次的觀看。

如果你覺得本文有用,想再看更多我寫關於DIY網站開發,Google SEO內容的話,可以以你的電郵進行 訂閱

作者 :- 全端網站開發者,教練

其他文章