命名空间
另外最好的实践就是当命名你的类名的时候,使用命名空间前缀来进行分类。这些前缀会在你的命名前添加一组字符,但是这个值能立刻标记每一个类的目的,在你看 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

css 命名规范参考[转]的更多相关文章

  1. web前端开发CSS命名规范参考

    做为一个web前端工程师,每天接触HTML.css就像吃饭一样,但是作为一名合作.优秀的web前端工程师,对DIV+CSS命名还是有一定的规范的,本文整理了一份web前端开发中DIV+CSS各种命名规 ...

  2. CSS命名规范参考及书写注意事项

    CSS书写顺序 *{ /*显示属性*/ display position float clear cursor … /*盒模型*/ margin padding width height /*排版*/ ...

  3. CSS 命名规范及标题供参考与学习

    一.CSS 命名规范   XHTML-CSS写作建议 所有的xhtml代码小写 属性的值一定要用双引号("")括起来,且一定要有值 每个标签都要有开始和结束,且要有正确的层次 空元 ...

  4. DotNet命名规范参考(转)

    来自:http://www.cnblogs.com/w-y-f/archive/2012/05/30/2526254.html DotNet命名规范参考 一.命名规范 注意事项:使用英文命名规则,尽量 ...

  5. 通用CSS命名规范

    一.文件命名规范 样式文件命名主要的 master.css布局,版面 layout.css专栏 columns.css文字 font.css打印样式 print.css主题 themes.css [/ ...

  6. CSS 命名规范总结

    CSS 命名规范总结 BEM 命名给 CSS 以及 html 提供清晰结构,命名空间提供更多信息,模块化提高代码的重用,以达到 CSS 命名语义化.可重用性高.后期维护容易.加载渲染快的要求. 首先, ...

  7. CSS命名规范

    DIV+CSS规范命名大全集合 前端人员必看CSS命名规范 整理: 文件名必须由小写字母.数字.中划线组成 ).所有的命名最好都小写,一律采用小写加中划线的方式,不允许使用大写字母或 _2).属性的值 ...

  8. html,css命名规范 (转)

    HTML+CSS命名规范总结 1.HTML部分 1.1添加必须的utf-8的字符集,并且使用HTML5的简洁 方式: <meta charset="utf-8"> 1. ...

  9. Html+CSS命名规范:

     Html+CSS命名规范: 1.样式命名: 2.样式文件命名:

随机推荐

  1. Linux环境下安装mysql5.6(二进制包不是rpm格式)

    一.准备: 1.CentOS release 6.8 2.mysql-5.6.31-linux-glibc2.5-x86_64.tar.gz 3.Linux下MySQL5.6与MySQL5.7安装方法 ...

  2. 历年NOIP题

    做了几天远古老题,发现不可做,于是咕掉..转而从2005开始.. 1997: P1549 棋盘问题(2):搜索,优化搜索顺序,对于第一行第一列先搜小的(但是其实这样是错的,仅仅能过原题) 加强版咕. ...

  3. php MySQL 数据类型

    MySQL 数据类型 MySQL中定义数据字段的类型对你数据库的优化是非常重要的. MySQL支持多种类型,大致可以分为三类:数值.日期/时间和字符串(字符)类型. 数值类型 MySQL支持所有标准S ...

  4. 十三.基础邮件服务、parted分区工具、交换分区、链路聚合

    1.基础邮件服务 DNS服务器:虚拟机classroom   以server0.example.com 为例  yg@server0.example.com    xln@server0.exampl ...

  5. promise 及 setTimeout 执行顺序

    setTimeout(function() { console.log(1); }, 0); new Promise(function(res, rej) { res(2); console.log( ...

  6. LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿

    二次联通门 : LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿 /* LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿 dp 记录一下前驱 ...

  7. git 忽略文件 目录

    git status 这里面的iml文件类似 eclipse .project文件 ,不能删除 .删除就不能识别项目了. 通过git .gitignore文件 过滤 git status  gitig ...

  8. centos7 安装 mysql5.6(MySQL-5.6.44-1.el7.x86_64.rpm-bundle.tar)

    1.卸载MariaDB rpm -qa | grep -i mariadb rpm -e --nodeps mariadb-libs--.el7.x86_64 2.卸载已有Mysql 卸载旧版本mys ...

  9. Mixed Content: The page at ‘https://XXX’ was loaded over HTTPS, but requested an insecure........

    iframe引入视频的文件的时候报这个错 其实只要改成 加上一个s就好了  ...

  10. mysql转移Data目录

    本来很简单的事,为何这么复杂,转目录后经常不成功.mysql安装时就不能指定数据目录吗?老是默认在C盘 测试环境Windows10, mysql5.7,以下是测试记录: 1. 复制Data到D盘下,如 ...