Bootstrap CSS编码规范

//Withoutnesting.table>thead>tr>th{…}.table>thead>tr>td{…}//Withnesting.table>thead>tr{>th{…}>td{…}}注释代码是由人编写并维护的。请确保你的代码能够自描述、注释良好并且易于他人理解。好的代码注释能够传达上下文关系和代码目的。不要简单地重申组件或class名称。对于较长的注释，务必书写完整的句子；对于一般性注解，可以书写简洁的短语。/*Badexample*//*Modalheader*/.modal-header{...}/*Goodexample*//*Wrappingelementfor.modal-titleand.modal-close*/.modal-header{...}class命名class名称中只能出现小写字符和破折号（dashe）（不是下划线，也不是驼峰命名法）。破折号应当用于相关class的命名（类似于命名空间）（例如，.btn和.btn-danger）。避免过度任意的简写。.btn代表button，但是.s不能表达任何意思。class名称应当尽可能短，并且意义明确。使用有意义的名称。使用有组织的或目的明确的名称，不要使用表现形式（presentational）的名称。基于最近的父class或基本（base）class作为新class的前缀。使用.js-*class来标识行为（与样式相对），并且不要将这些class包含到CSS文件中。在为Sass和Less变量命名是也可以参考上面列出的各项规范。/*Badexample*/.t{...}.red{...}.header{...}/*Goodexample*/.tweet{...}.important{...}.tweet-header{...}选择器对于通用元素使用class，这样利于渲染性能的优化。对于经常出现的组件，避免使用属性选择器（例如，[class^="..."]）。浏览器的性能会受到这些因素的影响。选择器要尽可能短，并且尽量限制组成选择器的元素个数，建议不要超过3。只有在必要的时候才将class限制在最近的父元素内（也就是后代选择器）（例如，不使用带前缀的class时--前缀类似于命名空间）。扩展阅读：ScopeCSSclasseswithprefixesStopthecascade/*Badexample*/span{...}.page-container#stream.stream-item.tweet.tweet-header.username{...}.avatar{...}/*Goodexample*/.avatar{...}.tweet-header.username{...}.tweet.avatar{...}代码组织以组件为单位组织代码段。制定一致的注释规范。使用一致的空白符将代码分隔成块，这样利于扫描较大的文档。如果使用了多个CSS文件，将其按照组件而非页面的形式分拆，因为页面会被重组，而组件只会被移动。/**Componentsectionheading*/.element{...}/**Componentsectionheading**Sometimesyouneedtoincludeoptionalcontextfortheentirecomponent.Dothatuphereifit'simportantenough.*/.element{...}/*Contextualsub-componentormodifer*/.element-heading{...}编辑器配置将你的编辑器按照下面的配置进行设置，以避免常见的代码不一致和差异：用两个空格代替制表符（soft-tab即用空格代表tab符）。保存文件时，删除尾部的空白符。设置文件编码为UTF-8。在文件结尾添加一个空白行。参照文档并将这些配置信息添加到项目的.editorconfig文件中。例如：Bootstrap中的.editorconfig实例。更多信息请参考aboutEditorConfig。