設(shè)為首頁 | 加為收藏 | 聯(lián)系我們 咨詢熱線:0632-5272123
電 話:0632-5272123
傳 真:0632-5271123
地 址: 棗莊市文化西路23號
E-mail:zzint@zzint.com
  • 技術(shù)咨詢:
  • 業(yè)務(wù)咨詢:
  • 客戶服務(wù):
  • 服務(wù)監(jiān)督:
詳細(xì)資料 您當(dāng)前的位置:網(wǎng)站首頁新聞動態(tài)詳細(xì)資料

建站DIV+CSS 之網(wǎng)頁切圖過程中div+css命名規(guī)則

內(nèi)容:contentcontainer 導(dǎo)航:nav 側(cè)欄:sidebar
  欄目:column 標(biāo)志:logo 頁面主體:main
  廣告:banner 熱點(diǎn):hot 新聞:news
  下載:download 子導(dǎo)航:subnav 菜單:menu
  搜索:search 頁腳:footer 滾動:scroll
  版權(quán):copyright 友情鏈接:friendlink 子菜單:submenu
  內(nèi)容:content 標(biāo)簽頁:tab 文章列表:list
  注冊:regsiter 提示信息:msg 小技巧:tips
  加入:joinus 欄目標(biāo)題:title 指南:guild
  服務(wù):service 狀態(tài):status 投票:vote
  尾:footer 合作伙伴:partner 登錄條:loginbar
  頁面外圍控制整體布局寬度:wrapper 左右中:left right center

  (二)注釋的寫法

   Footer
  內(nèi)容區(qū)
   End Footer

  (三)id的命名

  (1)頁面結(jié)構(gòu)
  容器 container頁頭:header 內(nèi)容:contentcontainer
  頁面主體:main 頁尾:footer 導(dǎo)航:nav
  側(cè)欄:sidebar欄目:column 左右中:left right center
  頁面外圍控制整體布局寬度:wrapper

  (2)導(dǎo)航
  導(dǎo)航:nav
  主導(dǎo)航:mainbav
  子導(dǎo)航:subnav
  頂導(dǎo)航:topnav
  邊導(dǎo)航:sidebar
  左導(dǎo)航:leftsidebar
  右導(dǎo)航:rightsidebar
  菜單:menu子菜單:submenu標(biāo)題 title摘要 summary

  (3)功能
  標(biāo)志:logo
  廣告:banner
  登陸:login
  登錄條:loginbar
  注冊:regsiter
  搜索:search
  功能區(qū):shop
  標(biāo)題:title
  加入:joinus
  狀態(tài):status
  按鈕:btn
  滾動:scroll
  標(biāo)簽頁:tab
  文章列表:list
  提示信息:msg
  當(dāng)前的 current
  小技巧:tips
  圖標(biāo) icon
  注釋:note
  指南:guild
  服務(wù):service
  熱點(diǎn):hot
  新聞:news
  下載:download
  投票:vote
  合作伙伴:partner
  友情鏈接:link
  版權(quán):copyright

  (四)class的命名

  (1)顏色使用顏色的名稱或者16進(jìn)制代碼,如
  .red { color red; }
  .f60 { color #f60; }
  .ff8600 { color #ff8600; }
  (2)字體大小,直接使用font+字體大小作為名稱,如
  .font12px { font-size 12px; }
  .font9pt {font-size 9pt; }
  (3)對齊樣式,使用對齊目標(biāo)的英文名稱,如
  .left { floatleft; }
  .bottom { floatbottom; }
  (4)標(biāo)題欄樣式,使用類別+功能的方式命名,如
  .barnews { }
  .barproduct { }

  注意事項(xiàng)

  1.一律小寫;
  2.盡量用英文;
  3.不加中杠和下劃線;
  4.盡量不縮寫,除非一看就明白的單詞.
  主要的 master.css 模塊 module.css基本共用 base.css
  主題 themes.css 專欄 columns.css 打印 print.css
  文字 font.css 表單 forms.css 補(bǔ)丁 mend.css
  布局,版面 layout.css 棗莊網(wǎng)站制作

上篇文章:(PS)網(wǎng)頁中切圖注意事項(xiàng)
下篇文章:CSS+DIV布局的優(yōu)缺點(diǎn)
版權(quán)所有 棗莊市英特信息網(wǎng)絡(luò)有限公司 ◎2017
聯(lián)系電話:0632-5271123 5272123  總部地址:棗莊市市中區(qū)文化西路23號
魯ICP備09021689號 增值電信業(yè)務(wù)經(jīng)營許可證編號:魯 B2-20080087號