WEB前端規範命名_ZenDei技術網路在線

WEB前端規範命名

-Advertisement-

頭部 header 用於頭部主要內容 main 用於主體內容（中部）左側 main-left 左側佈局右側 main-right 右側佈局外套 wrap 用於最外層導航條 nav 網頁菜單導航條內容 content 用於網頁中部主體底部 footer 用於底部頭部 header 用於 ...

頭部 header ----------------用於頭部
主要內容 main ------------用於主體內容（中部）
左側 main-left -------------左側佈局
右側 main-right -----------右側佈局

外套 wrap ------------------用於最外層

導航條 nav -----------------網頁菜單導航條
內容 content ---------------用於網頁中部主體
底部 footer -----------------用於底部

網頁公共命名： #wrapper頁面外圍控制整體佈局寬度 #container或#content容器, 用於最外層#layout佈局 #head, #header頁頭部分 #foot, #footer頁腳部分 #nav主導航 #subnav二級導航 #menu菜單#submenu子菜單 #sideBar側欄#sidebar_a, #sidebar_b左邊欄或右邊欄 #main頁面主體 #tag標簽#msg #message提示信息#tips小技巧#vote投票# friendlink友情連接 #title標題#summary摘要 #loginbar登錄條 #searchInput搜索輸入框 #hot熱門熱點#search搜索 #search_output搜索輸出和搜索結果相似 #searchBar搜索條 #search_results搜索結果 #copyright版權信息#branding商標 #logo網站LOGO標誌 #siteinfo網站信息#siteinfoLegal法律聲明 #siteinfoCredits信譽#joinus加入我們 #partner合作伙伴#service服務 #regsiter註冊arr/arrow箭頭 #guild指南#sitemap網站地圖 #list列表#homepage首頁 #subpage二級頁面子頁面 #tool, #toolbar工具條#drop下拉#dorpmenu下拉菜單 #status狀態#scroll滾動. tab標簽頁.left .right .center居左、中、右.news新聞 .download下載 .banner廣告條(頂部廣告條)電子貿易相關.products產品 .products_prices產品價格.products_description產品描述 .products_review產品評論 .editor_review編輯評論.news_release最新產品 .publisher生產商.screenshot縮略圖 .faqs常見問題.keyword關鍵詞.blog博客 .forum論壇CSS文件命名說明master.css,style.css主要的module.css模塊base.css基本共用layout.css佈局，版面themes.css主題columns.css專欄font.css文字、字體forms.css表單mend.css補丁print.css列印

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

java SSM 框架代碼生成器 websocket 即時通訊 shiro redis 多數據源後臺框架源碼

A 調用攝像頭拍照，自定義裁剪編輯頭像，頭像圖片色度調節B 集成代碼生成器 [正反雙向](單表、主表、明細表、樹形表，快速開發利器)+快速表單構建器 freemaker模版技術，0個代碼不用寫，生成完整的一個模塊，帶頁面、建表sql腳本，處理類，service等完整模塊C 集成阿裡巴巴資料庫連接池 ...
bootstrap學習筆記(表單)

1.基礎表單：對於基礎表單，Bootstrap並未對其做太多的定製性效果設計，僅僅對錶單內的fieldset、legend、label標簽進行了定製。 fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } legend { dis ...
bootstrap框架怎麼在html頁面載入使用

今天敲代碼的時候，正好碰到這個問題. 與大家分享這個解決方法： 1/7 到bootstrap官方網站下載，對於我們開發者來說，直接下載編譯和壓縮後的CSS、JavaScript文件，另外還包含字體文件，但是不包含文檔和源碼文件。打開解壓包之後可以發現包含三個文件夾 css、fonts、js。這是最基 ...
【webpack】webpack-dev-server生猛上手——讓我們來搭一個webpack的微伺服器吧！

因為最近在搞百度地圖API的時候到了webpack的externals，才發現我之前都只是用webpack做一些搭建完項目後的“收尾工作”——即打包，而沒有把它納入到項目開發的“主體過程”中來，真是“物不盡其用”。於是就有了我今天的這篇文章。本文提綱：1.複習webpack的知識 2.詳解webp... ...
CSS學習筆記01 CSS簡介

1、CSS定義 CSS 指層疊樣式表 (Cascading Style Sheets)，是一種樣式表語言，用來描述 HTML 或 XML（包括如 SVG、XHTML 之類的 XML 分支語言）文檔的呈現。CSS 描述了在屏幕、紙質、音頻等其它媒體上的元素應該如何被渲染的問題。 2、為何使用CSS 網 ...
Android與javascript中事件分發機制的簡單比較

在前面兩篇博客中，我們討論了Android中的事件分發的相關內容，那麼在本篇博客當中，我們就簡單探討一下html或javascript中的事件分發機制，併進行簡單的對比。在前端中，對事件進行綁定有三種方式。（1）.在DOM中綁定。 (2).在腳本中綁定。 (3).通過監聽事件綁定而對於前兩種 ...
Tween.js 動畫效果

一、apply,和call的用法。先來一個與本次博文無關的東西，就是apply和call的用法。其實apply和call的用法都一樣，只是他們的傳參不一樣。apply是數組，而call是單獨的傳，類似枚舉。 1.列子一把arguments轉化為標準數組，可以使用push等方法。 2.如何把argu ...
HTML學習筆記《一》

HTML 一、簡介 1.HTML是超文本標記語言，標準通用標記語言下的一個應用，解釋性語言。 2.“超文本”就是指頁面內可以包含圖片、鏈接，甚至音樂、程式等非文字元素。 3.超文本標記語言的結構包括“頭”部分（英語：Head）、和“主體”部分（英語：Body），其中“頭”部提供關於網頁的信息，“主體 ...