CSS布局命名規範

來源:互聯網
上載者:User

CSS布局命名規範

說明:均為class,需要擴充,則在當前命名內以“_“(底線)尾碼自定名稱。
我習慣稱列表頁為list,新聞列表則為newslist,圖片列表為piclist,
內容頁為view,
/**/
整體大架構:#wrapper
大架構內:#inwrapper
/////////////////////////////////////////////////////////////////////////////////////////////////////////
頂部及banner:.top
頂部及banner內:.intop
Logo:.logo
Banner:.banner
導航:.menu
導航內:.inmenu
        .Menuul
        .Menuul li
        .Menuul li a
下拉式功能表:.inmenu_xiala
          .Inmenu_xialaul
          .Inmenu_xialaul li
          .Inmenu_xialaul li a
///////////////////////////////////////////////////////////////////////////////////////////////////////////
主體內容:.mainWrapper
主體內容內:.inmainwrapper
左側攔:.sideleft
左側內:.insideleft
右側欄:.sideright
右側內:.insideright
中間:.sidecenter
中間內:.insidecenter
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
底部:.foot
底部內:.infoot
////////////////////////////////////////////////////////////////////////////////////////////////////////////
/*其他命名*/
搜尋:.search
搜尋內:.insearch
搜尋條:.searchselect
搜尋按鈕:.serachbuttom
輸入文字框:.input
.select

/*表格樣式*/
表格整體架構:.listbox
表格的寬度:.listbox-table
表格頭部文字樣式:.listbox-header
表格本文文字樣式:.listbox-entry
/*通用型*/
通用:.GM/*這個有點鬱悶,英文太差...*/
通用內:.INGM
通用左浮動:.GMfl(GM FLOAT LEFT)
通用右浮動:.GMfr(GM FLOAT RIGHT)
/*通用圖片樣式*/
通用圖片樣式:.img
/*清除浮動*/
清除所有浮動:.clear
清除左側浮動:.clearleft
清除右側浮動:.clearright
/*文字樣式*/
文字:.font
/*新聞列表*/
新聞列表:.fontnews
/*View頁字型總樣式*/
VIEW頁字型:.fontview



相關文章

Cloud Intelligence Leading the Digital Future

Alibaba Cloud ACtivate Online Conference, Nov. 20th & 21st, 2019 (UTC+08)

Register Now >

Starter Package

SSD Cloud server and data transfer for only $2.50 a month

Get Started >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。