css 命名规范参考[转]

 

命名空间
另外最好的实践就是当命名你的类名的时候，使用命名空间前缀来进行分类。这些前缀会在你的命名前添加一组字符，但是这个值能立刻标记每一个类的目的，在你看 HTML 或者样式的时候是很需要的。我使用下面这些命名空间：

对象类：.o-
组件：.c-
状态类：.is- 或者 .has-
主题：.t-
工具类：.u-
JavaScript 勾子：.js-
<footer class="c-footer">
    <div class="o-container-wide">
        <a class="c-footer__logo" href="/">The Assist</a>
        <div class="c-social c-social--follow">
            <div class="c-social__label u-txt-center">Join the conversation</div>
            <ul class="c-social__list">
                <li class="c-social__item"></li>
                <li class="c-social__item is-active"></li>
                <li class="c-social__item"></li>
            </ul>
        </div>
        <p class="c-footer__credit"></p>
    </div>
</footer>

 

原文地址：https://www.60sky.com/post/thoughtful-css-architecture.html