参考:Web项目的CSS文件结构组织及属性编写
摘要:
影响文档流的属性(display, position, float, clear, visibility, table-layout)
自身盒模型的属性(width, height, margin, padding, border)
排版相关属性(font, line-height, text-align, text-indent, vertical-align)
装饰性属性(color, background, opacity, cursor)
生成内容的属性(content, list-style, quotes)
CSS3属性:transform/transition/animation/box-shadow/border-radius
加浏览器前缀,按照 -webkit- / -moz- / -ms- / -o- / std的顺序,标准属性写在最后。
el { display: ; visibility: ; float: ; clear: ; position: ; top: ; right: ; bottom: ; left: ; z-index: ; width: ; min-width: ; max-height-width: ; height: ; min-height: ; max-height: ; overflow: ; margin: ; margin-top: ; margin-right: ; margin-bottom: ; margin-left: ; padding: ; padding-top: ; padding-right: ; padding-bottom: ; padding-left: ; border: ; border-top: ; border-right: ; border-bottom: ; border-left: ; border-width: ; border-top-width: ; border-right-width: ; border-bottom-width: ; border-left-width: ; border-style: ; border-top-style: ; border-right-style: ; border-bottom-style: ; border-left-style: ; border-color: ; border-top-color: ; border-right-color: ; border-bottom-color: ; border-left-color: ; outline: ; list-style: ; table-layout: ; caption-side: ; border-collapse: ; border-spacing: ; empty-cells: ; font: ; font-family: ; font-size: ; line-height: ; font-weight: ; text-align: ; text-indent: ; text-transform: ; text-decoration: ; letter-spacing: ; word-spacing: ; white-space: ; vertical-align: ; color: ; background: ; background-color: ; background-image: ; background-repeat: ; background-position: ; opacity: ; cursor: ; content: ; quotes: ; }
How do you order your properties within a declaration block?