在基於bem命名思想的基礎上,我整理一些實用的點:
bem,b即block(塊),e即element(元素),m即modifier(修飾符)
塊:最頂層,可包含塊和元素
元素:被塊包含,通常為最終被包含項,即無子代,當然,也有例外,它有時也會包含其他,如:
<div
class
="media"
>
<
img
src="logo.png"
alt="foo corp logo"
class
="media__img--rev"
>
<
div
class
="media__body"
>
<
h3 class
="alpha"
>welcome to foo corp
h3>
<
p class
="lede"
>foo corp is the best, seriously!
p>
div>
div>
應注意的,它內部的東西class單獨命名,最好不要有層級關係
修飾符:可修飾塊和元素,表示一種狀態
注意,不是所有時候都用bem,當你覺得乙個dom結構符合使用bem的條件時,你就可以用
完整的class名結構如下:
block-name__element-name--modifier
我的命名習慣
1,小寫,兩個詞中使用 來連線。2,收集專業的詞語 3,固定縮寫詞 a,型別 by byty b bool w word dw dword i int l long f float d double str cstring c char sz char p pointer lp long point...
我的習慣清單
從2010年5月21日開始執行 我要養成的好習慣 我需要改掉的壞習慣 每天早晨6 40起床,看半小時與技術無關的書籍。晚上吃的多。做事不拖拉,第一次就把事情做好,做徹底,不要為沒做好的事情找藉口 理由。看電視時間過長。學會拒絕,無論是生活中 朋友中 還是同事 工作中。看電視時間過長。每天早上上班和下...
BEM的命名規範
css 的命名規範又叫做bem規範,為的是結束混亂的命名方式,達到乙個語義化的css命名方式。bem是三個單詞的縮寫 block 塊 代表更高階別的抽象或元件,element 元素 block的後代,以及modifier 修飾 不同狀態的修飾符。命名方法 block element modifier...