CSS學習筆記 十二 CSS命名規範

2021-09-20 06:08:10 字數 888 閱讀 9282

引言:最近想將這幾個月做過的東西元件化,然後首先想到的是編碼規範化!本文只涉及 css 命名規範,搬來了alloyteam 造好的輪子。可能並不完全適用,在以後開發過程中再根據需要進行修改。╮(╯_╰)╭

/* footer */

內容區/* end footer */

使用顏色的名稱或者十六進製制。

舉例:.red

.f60

.ff8600

直接使用font+字型大小作為名稱。

舉例:.font12px

.font9pt

使用對齊目標的英文名稱。

舉例:.left

.bottom

使用類別+功能的方式命名。

舉例:.barnews{}

.barproduct{}

一律小寫;

盡量用英文;

不加中槓和下劃線;

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

!然後,我放下最後一塊磚頭,滾去學習了,再見(。・_・)/~~~

參考資料

編寫可維護的css - segmentfault

bem + emmet = 根本停不下來 - segmentfault

css編碼規範 - segmentfault

bem —— 源自yandex的css 命名方** - segmentfault

CSS學習筆記 十二 CSS命名規範

引言 最近想將這幾個月做過的東西元件化,然後首先想到的是編碼規範化!本文只涉及 css 命名規範,搬來了alloyteam 造好的輪子。可能並不完全適用,在以後開發過程中再根據需要進行修改。footer 內容區 end footer 使用顏色的名稱或者十六進製制。舉例 red f60 ff8600 ...

CSS3學習筆記(十二) transform

1 旋轉rotate 設定乙個角度值,用來指定旋轉的幅度。如果這個值為正值,元素相對原點中心順時針旋轉 如果這個值為負值,元素相對原點中心逆時針旋轉 2 扭曲skew 它可以將乙個物件以其中心位置圍繞著x軸和y軸按照一定的角度傾斜。這與rotate 函式的旋轉不同,rotate 函式只是旋轉,而不會...

CSS學習 CSS學習筆記

出處 注 本學習筆記只是自己的一些備忘,初學者的東西不具有參考性,請到w3school 進行系統學習。學習css我使用的工具是visual css,可以實現同步預覽,快速學習編輯css。1.css的作用 用來規定網頁中的內容的顯示方式,避免給html增加很多的屬性而將 變得臃腫。2.css的應用方式...