基本範例4

  • 文章分類: 學CSS
  • 10/4/2010

CSS(範例四)

( 圖二十)檔名:1.png
( 圖二十ㄧ)檔名:2.jpg
(圖二十二)
(圖二十三)
    CSS(範例四)裡我們將sample及sub-sample的背景圖片分別換成(圖二十)及(圖二十一),接著把sub-sub-sample1、sub-sub-sample2、sub-sub-sample3各自加上背景顏色。我們接著把sub-sample的位置進行微調(CSS黑色加底線的文字處),執行結果為(圖二十二)。 為了讓學習者更清楚我們將HTML 裡的五格區塊各自圈選起來,做區塊的區分,如(圖二十三)。

說明:

我們只要用同ㄧ個HTML搭配各種不同的CSS就可以設計出各式不同風格的網站。如同以上教學,我們都是使用同一張HTML再搭配不同的CSS即可做出各式變化。寫CSS最重要的就是需要瞭解HTML裡階層的概念,只要瞭解HTML階層概念,寫CSS就不再是一件困難的事了。從網站及語法書裡就可以取得詳細的CSS語法。