用CSS建設網站的實例_CSS教程

      編輯Tag賺U幣
      教程Tag:暫無Tag,歡迎添加,賺取U幣!
      本篇已得到原作者Steve Dennis的翻譯準予,在此Jorux表示感謝!

      本教程主要參考Creating a CSS Layout from scratch,由Jorux翻譯,以意譯為主,其間加入了不少Jorux的個人觀點,省略了一些多余的說明,請讀者明鑒。

      第一步:規劃網站,本教程將以圖示為例構建網站

    1. 1.規劃網站,本教程將以下圖為例構建網站。

      其基本布局見下圖:

       

       

      DIV CSS網頁布局實例:十步學會用CSS建站

       

       

      主要由五個部分構成:

      DIV CSS網頁布局實例:十步學會用CSS建站

      1.Main Navigation 導航條,具有按鈕特效。 Width: 760px Height: 50px

       

       

      2.Header 網站頭部圖標,包含網站的logo和站名。 Width: 760px Height: 150px

      3.Content 網站的主要內容。 Width: 480px Height: Changes depending on content

      4.Sidebar 邊框,一些附加信息。 Width: 280px Height: Changes depending on

       

       

      5.Footer 網站底欄,包含版權信息等。 Width: 760px Height: 66px

    2. 來源:模板無憂//所屬分類:CSS教程/更新時間:2008-01-09
      相關CSS教程