Discuzx系统 CSS 编码规范,CSS属性书写顺序
1. 属性写在一行内,属性之间、属性名和值之间以及属性与“{}”之间须有空格,例如:.class { width: 400px; height: 300px; }
2. 属性的书写顺序:
2.1. 按照元素模型由外及内,由整体到细节书写,大致分为五组:
位置:position,left,right,float
盒模型属性:display,margin,padding,width,height
边框与背景:border,background
段落与文本:line-height,text-indent,font,color,text-decoration,...
其他属性:overflow,cursor,visibility,...
2.2. 针对特殊浏览器的属性,应写在标准属性之前,例如:-webkit-box-shadow:; -moz-box-shadow:; box-shaow:;
3. 谨慎添加新的选择符规则,尤其不可滥用 id,尽可能继承和复用已有样式
4. 选择符、属性、值均用小写(格式的颜色值除外),缩写的选择符名称须说明缩写前的全称,例如 .cl -> Clearfix
5. 避免使用各种 CSS Hack,如需对 IE 进行特殊定义,请参阅下节“关于 CSS Hack 的说明”
6. 勿使用冗余低效的 CSS 写法,例如:
ul li a span { ... }
7. 慎用 !important
8. 建议使用在 class/id 名称中的词语
6.1. 表示状态:a->active
6.2. 表示结构:h->header,c->content,f->footer
6.3. 表示区域:mn->main,sd->side,nv-navigation,mu->menu
6.4. 表示样式:l-list,tab,p_pop
9. 开发过程中的未定事项,须用 [!] 标出,以便于后续讨论整理
Discuzx系统 CSS 编码规范,CSS属性书写顺序的更多相关文章
- Google HTML/CSS 编码规范
Google HTML/CSS 规范 本文介绍了 Google 推荐的 HTML 和 CSS 编写格式规范,以建立良好的个人编码习惯. 1.通用样式规范 省略图片.样式.脚本以及其他媒体文件 URL ...
- Bootstrap-Other:CSS编码规范
ylbtech-Bootstrap-Other:CSS编码规范 1.返回顶部 1. Bootstrap CSS编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致 ...
- 8.Bootstrap CSS编码规范
Bootstrap CSS编码规范 本节的介绍内容为 Bootstrap 中的 CSS 编码规范. 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择 ...
- HTML编码规范、CSS编码规范
HTML编码规范 IE 兼容模式 IE 支持通过特定的 标签来确定绘制当前页面所应该采用的 IE 版本.除非有强烈的特殊需求,否则最好是设置为 edge mode,从而通知 IE 采用其所支持的最新的 ...
- CSS编码规范(转)
1 前言 CSS作为网页样式的描述语言,在百度一直有着广泛的应用.本文档的目标是使CSS代码风格保持一致,容易被理解和被维护. 虽然本文档是针对CSS设计的,但是在使用各种CSS的预编译器(如less ...
- 戏说前端之CSS编码规范
前言 项目启动时 css 应该注意哪些问题 文件名规范 文件名建议用小写字母加中横线的方式.为什么呢?因为这样可读性比较强,看起来比较清爽,像链接也是用这样的方式,例如 // 地址: github的地 ...
- css编码规范
css编码规范 https://segmentfault.com/a/1190000002460968 常用样式测试工具 W3C CSS validator:http://jigsaw.w3.org/ ...
- HTML CSS编码规范(黄金定律)
HTML 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 嵌套元素应当缩进一次(即两个空格). 对于属性的定义,确保全部使用双引号,绝不要使用单引号. 不 ...
- 前端HTML与CSS编码规范
HTML 语法 HTML5 doctype 语言属性(Language attribute) 字符编码 IE 兼容模式 引入 CSS 和 JavaScript 文件 实用为王 属性顺序 布尔(bool ...
随机推荐
- 《InsideUE4》-9-GamePlay架构(八)Player
你们对力量一无所知 引言 回顾上文,我们谈完了World和Level级别的逻辑操纵控制,如同分离组合的AController一样,UE在World的层次上也采用了一个分离的AGameMode来抽离了游 ...
- 【原】使用VirtIE6代替IE6
做前端开发难免要使用IE6,相信很多朋友知道win7上是不支持安装IE6的,通常会使用IETester,要么在win7中安装虚拟机,在虚拟机中安装IE6. 分析下这2种方式: IETester:并不是 ...
- 【2016-10-25】【坚持学习】【Day12】【WPF】【Telerik】【VirtualtionData 虚拟化数据】
VirtualQueryableCollectionView When working with the UI components that enable UI Virtualization, yo ...
- POJ2455Secret Milking Machine[最大流 无向图 二分答案]
Secret Milking Machine Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 11865 Accepted ...
- return和finally的执行和联系
1.try{}里有一个return语句,那么紧跟在这个try后的finally {}里的code会不会被执行,什么时候被执行,在return前还是后? 也许你的答案是在return之前,但往更细地说, ...
- python基础之dict、set及字符
python基础之dict.set及字符串处理 本节内容 字典介绍及内置方法 集合介绍 字符串处理 1.字典介绍及内置方法 字典是python中唯一的映射类型,采用键值对(key-value)的形式存 ...
- jquery的curCSS方法
核心思想是用getComputedStyle获取样式,如果没有获取到就判断是不是动态创建的元素,如果是则用style获取行内样式.看重点(注释部分)代码吧! curCSS = function( el ...
- 分布式监控系统Zabbix-3.0.3-完整安装记录(2)-添加mysql监控
Zabbix3.0 Server以后就自带了MySQL插件来监控mysql数据库的模板,只需要配置好agent客户端,然后在web端给主机增加模板就行了. 以下是公司线上的zabbix3.0环境下添加 ...
- JS文件加载:比较async和DOM Script
async与script动态加载都能使文件异步加载,本文叙述它们对页面渲染和load加载的影响方面. 目前我用demo.js作为执行文件操作.代码: var now = function() { re ...
- 初学C#和MVC的一些心得,弯路,总结,还有教训(1)--语言的选择
因为惰性,自制力,求知欲等各方面原因....一直没有学新技术,总感觉VB6凑合能用就凑合用.... 于是大概从05年开始,几乎每次新版的vs一发布,我就下载回来,然后安装,然后,,,,就扔那了.... ...