BEM 是一种 CSS 类的命名方法,Taro UI 里用了这种命名方法 .. B 指的是 Block 就是区块 .. E 是 Element ,表示元素 .. M 是 Modifier ,修饰符 ..
一个界面组件的样式你可以把它分成这三个部分 .. 比如一个卡片组件 .. 这个组件总体叫 card .. 这个 card 也就表示一个 Block ,就是区块 ..
组件里面包含了几个部分,比如卡片的头部,图像,主体内容等等,这些都是 card 这个区块里的元素 .. 也就是命名这些东西的时候,你可以用 card 作为前缀,因为 card 是区块 .. 区块跟元素之间用两个下划线连接 .. 比如 card__image,表示的就是卡片里的图像 .. 用这个类去设计卡片里的图像的样式 ..
元素或者区块后面可以跟着修饰符 .. 这些修饰符可以改变元素的某些行为或者样式 .. 连接修饰符用两个小横线 .. 比如 card__image--rounded .. 这个类名字最后面这部分就是修饰符 .. 你可以用这个类为卡片里的图像添加圆角的效果 ..