Web css named way BEM

For developing front end , BEM is a perfect way of name your dom css name .
there is simple introduce :

.1  .block-warp-name :represent advance or abstract parent dom .
.2  .block--wrap-name__name : the block in block-wrap-name
.3  .block-wrap-name--modify : the different state of it self .

Notice : use __ – because “-” will be used in wrap block . and you needn’t use “BEM” anywhere but the place that need use .
Example :

    < form class = "site-search full">
        <input type="button" class="btn"/>
    </form>

    ---------------------------------------------------

    < form class = "site-search site-search--full">
        <input type="button" class="site-search__btn"/>
    </form>

    it's so simple you can use anywhere .