十年專注于品牌網站建設 十年專注于品牌網站建設,低調、有情懷的網絡應用服務商!
南昌百恒網絡微信公眾號 掃一掃關注
小程序
tel-icon全國服務熱線:400-680-9298,0791-88117053
掃一掃關注百恒網絡微信公眾號
掃一掃打開百恒網絡微信小程序

百恒網絡

南昌百恒網絡

DIV+CSS規范命名【超全】

DIV+CSS規范命名 百恒網絡 2018-06-19 1505

DIV+CSS規范命名


  一、頁面結構


  容器:container

  頁頭:header

  內容:content/container

  頁面主體:main

  頁尾:footer

  導航:nav

  側欄:sidebar

  欄目:column

  頁面外圍控制整體布局寬度:wrapper

  左右中:left right center

  二、導航


  導航:nav

  主導航:mainbav

  子導航:subnav

  頂導航:topnav

  邊導航:sidebar

  左導航:leftsidebar

  右導航:rightsidebar

  菜單:menu

  子菜單:submenu

  標題:title

  摘要:summary

  三、功能


  標志:logo

  廣告:banner

  登錄:login

  登錄條:loginbar

  注冊:regsiter

  搜索:search

  功能區:shop

  標題:title

  加入:joinus

  狀態:status

  按鈕:btn

  滾動:scroll

  標簽頁:tab

  文章列表:list

  提示信息:msg

  當前的:current

  小技巧:tips

  圖標:icon

  注釋:note

  指南:guild

  服務:service

  熱點:hot

  新聞:news

  下載:download

  投票:vote

  合作伙伴:partner

  友情鏈接:friendlink

  版權:copyright

  四、顏色


  使用顏色的名稱或者16進制代碼,如:

  .red { color: red; }

  .f60 { color: #f60; }

  .ff8600 { color: #ff8600; }

  五、字體大小


  直接使用“font+字體大小”作為名稱,如:

  .font12px { font-size: 12px; }

  .font9pt {font-size: 9pt; }

  六、對齊樣式


  使用對齊目標的英文名稱,如:

  .left { float:left; }

  .bottom { float:bottom; }

  七、標題欄樣式


  使用“類別+功能”的方式命名,如:

  .barnews { }

  .barproduct { }

  電子貿易相關命名:

  .products 產品

  .products_prices 產品價格

  .products_des cription 產品描述

  .products_review 產品評論

  .editor_rwview 編輯產品

  .news_release 最新產品

  .publisher 生產商

  .screenshot 縮略圖

  .faqs 常見問題

  .keyword 關鍵詞

  .blog 博客

  .forum 論壇

  八、注意事項


  1、一律小寫;

  2、盡量用英文;

  3、不加中杠和下劃線;

  4、盡量不縮寫,除非一看就明白的單詞;

  5、屬性的值一定要用雙引號(“”)括起來,且一定要有值如class="divcss5",id="divcss5";

  6、每個標簽都要有開始和結束,且要有正確的層次,排版有規律工整。

  九、樣式文件命名


  主要的master.css

  模塊module.css

  基本共用base.css

  布局,版面layout.css

  主題themes.css

  專欄columns.css

  文字font.css

  表單forms.css

  補丁mend.css

  打印print.css
400-680-9298,0791-88117053
掃一掃關注百恒網絡微信公眾號
掃一掃打開百恒網絡小程序

歡迎您的光顧,我們將竭誠為您服務×

售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售后服務 售后服務
 
售后服務 售后服務
 
備案專線 備案專線
 
×
免费网站看v片在线