css的style guide

使用缩写属性
  /* Not recommended */
  border-top-style: none;
  font-family: palatino, georgia, serif;
  font-size: 100%;
  line-height: 1.6;
  padding-bottom: 2em;
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 0;
  /* Recommended */
  border-top: 0;
  font: 100%/1.6 palatino, georgia, serif;
  padding: 0 1em 2em;
忽略掉“0”
  font-size: .8em;
颜色的属性值使用三个特殊符号替代6个的
/* Not recommended */
color: #eebbcc;
/* Recommended */
color: #ebc;
选择器命名时需要带上该应用名的前缀
  .process-help {} /*Process */
  #dataset-note {} /* Dataset */
在每一个申明后添加分号
/* Not recommended */
.test {
  display: block;
  height: 100px
}
/* Recommended */
.test {
  display: block;
  height: 100px;
}
在属性和属性值之间使用单个空格
在选择器和大括号之间使用单个空格
在每一个选择器和申明使用新的一行
/* Not recommended */
a:focus, a:active {
  position: relative; top: 1px;
}
/* Recommended */
h1,
h2,
h3 {
  font-weight: normal;
  line-height: 1.2;
}
使用一个部分的代码使用一个部分的注释,使用注释将每个部分分隔开
/* Header */

#adw-header {}

/* Footer */

#adw-footer {}

/* Gallery */

.adw-gallery {}
使用 Autoprefixer自动添加浏览器厂商前缀
屏幕快照 2017-07-17 上午11.17.55.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,292评论 19 139
  • importUIKit classViewController:UITabBarController{ enumD...
    明哥_Young阅读 9,394评论 1 10
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 4,711评论 0 1
  • 前几天很意外的又看到了刘同的话: 当我们尽力把悲观的事情用乐观的态度去表达时,你会发现迷宫顺着走到出口能遇光明,倒...
    强尼君阅读 4,168评论 0 7
  • 今天的重庆,雨,有着它特有的味道。也像极了除去奢华的香港,感觉每一分钟都有一个精彩的故事在上演。感觉,你哪里,都是...
    青春当铺阅读 2,755评论 0 0