使用BEM开发vue组件

BEM是一种css开发的思想

BEM 是什么意思

BEM 其实是block，element，modifier的缩写，它们代表css中的块，元素和修饰符(例如：元素的状态)

BEM怎么使用

BEM 遵循下面的简单的规则，使用__双划线和--双划线做分割线，使用单个的 - 中划线作为你自己的样式分隔符。

BEM实例

.input-search{width:100px;height:20px;}
.input-search__icon{font-size:16px;}
.input-search__icon--selected{color: yellow;}
.input-search__value{color:red;font-size: 20xp;}

<div class="input-search">
    <i class="input-search__icon"></i>
    <i class="input-search__icon--selected">
    <input class="input-search__value">
</div>