命名空间
另外最好的实践就是当命名你的类名的时候,使用命名空间前缀来进行分类。这些前缀会在你的命名前添加一组字符,但是这个值能立刻标记每一个类的目的,在你看 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. 淘宝上的大智慧L2数据,月卡最便宜是8元钱,这个也可以获取BBD、DDX等数据!

    Want:从顶牛股网上下载DDX数据. 1.下载历史DDE数据:获取最近120个交易日的DDE数据 #define SFURL_DNG_SINGLEL"http://www.dingniug ...

  2. python - scrapy 爬虫框架 ( redis去重 )

    1.  使用内置,并加以修改 ( 自定义 redis 存储的 keys ) settings 配置 # ############### scrapy redis连接 ################# ...

  3. js中特殊的宏任务

    一.setImmediate 目前只有IE10+和NodeJS支持该API. 立即触发回调函数,使其进入宏任务队列(macro task queue) 语法: // 只有一个参数 setImmedia ...

  4. 测试使用API

    https://api.github.com/users/github 返回值中的某些URL也可以作为测试API使用

  5. PHP的输出语法

    一.echo 只能输出标量数据类型,对于任何数据都可以转为字符串输出 echo是PHP的一种特殊的'指令',不一定要像函数的那样()去使用,可以直接紧跟一个空格输出信息,可以是多个参数 <?ph ...

  6. maven下载与安装

    1.下载地址:http://maven.apache.org/download.cgi(Windows平台下载*.zip压缩包,Linux平台下载*.gz压缩包) 2.解压到E:\JAVA\Maven ...

  7. easy-table-vue+VueJs、SpringBoot+Mybatis实现MVVM模型前后台数据交互

    该项目分为前端展示部分和后台服务部分. 前端部分 使用的技术是:NodeJs.Webpack.VueJs 使用的组件库是:IVIEW.easy-table-vue 使用的开发工具是:WebStorm ...

  8. IDEA2018全局搜索中搜索jar包/lib

    搜索jar包 配置find in path ctrl+shift+f 点击 ...处 把lib添加进来 点击OK保存 之后在IDEA中 , 双击shift , 调出全局搜索框就可以搜索到 jar包里的 ...

  9. 接口测试命令Httpie的使用

    相比于curl命令,Httpie提供更清晰友好的界面,并支持授权,代理等操作 主要特性 直观的语法 格式化和色彩化的终端输出 内置 JSON 支持 支持上传表单和文件 HTTPS.代理和认证 任意请求 ...

  10. SpringBoot-文件在线预览解决方案-基于OpenOffice及jacob

    项目中有一个需求:实现文件(主要是Office文件)的在线预览,根据前端需求,Office文件需要转换成pdf或者html方可在浏览器中打开预览,那么后端需要将文件转为pdf/格式返回地址给前端.目前 ...