css属性顺序是css良好编码风格的一部分,有助于提高代码可读性,便于发现代码问题,有利于团队合作。(依次排后)

example {

/*显示属性*/
display: ;
visibility: ;
float: ;
clear: ;

/*定位属性*/

position: ;
top: ;
right: ;
bottom: ;
left: ;
z-index: ;

/*盒模型属性*/

width: ;
min-width: ;
max-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: ;

/*显示其他属性*/
outline: ;
list-style: ;

/*表格属性*/
border-collapse: ;
empty-cells: ;

/*文本属性*/

font: ;
font-style: ;
font-weight: ;
font-size: ;
line-height: ;
font-family: ;
text-align: ;
text-indent: ;
text-decoration: ;
letter-spacing: ;
word-spacing: ;
white-space: ;
vertical-align: ;
color: ;

/*背景属性*/
background: ;
background-color: ;
background-image: ;
background-repeat: ;
background-position: ;

/*其他属性*/

opacity: ;
cursor: ;
content: ;

}

前端开发--css属性书写顺序的更多相关文章

  1. Discuzx系统 CSS 编码规范,CSS属性书写顺序

    1. 属性写在一行内,属性之间.属性名和值之间以及属性与“{}”之间须有空格,例如:.class { width: 400px; height: 300px; }     2. 属性的书写顺序:    ...

  2. Mozilla推荐的CSS属性书写顺序及命名规则

    传说中的Mozilla推荐 /* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * ...

  3. CSS属性书写顺序及命名规则

    /* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * list-style * ...

  4. css属性书写顺序分析

    我们直接从例子出发 @font-face { font-family: 'icomoon'; src: url('fonts/icomoon.eot?speta9'); src: url('fonts ...

  5. css属性书写顺序(重点)

  6. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  7. 前端开发css禁止选中文本

    在我们日常的Java web前端开发的过程中呢,程序员们会遇到各种各样的要求,所以不每天学的东西感觉自己都退步了,都更不上时代的发展了. 每天应对各种需求,每天活在疑问中就是我们程序员的真是写照.但我 ...

  8. 第十一章 前端开发-css

    第十一章 前端开发-css 1.1.0 css介绍 css是指层叠样式表(Cascading Style Sheets),样式定义如何显示html元素,样式通常又会存在于样式表中. css优势: 内容 ...

  9. 前端开发css实战:使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

随机推荐

  1. PCL Show Point Cloud 显示点云

    在使用PCL库的时候,经常需要显示点云,可以用下面这段代码: #include <pcl/visualization/cloud_viewer.h> pcl::PointCloud< ...

  2. [CareerCup] 15.1 Renting Apartment 租房

    Write a SQL query to get a list of tenants who are renting more than one apartment. -- TABLE Apartme ...

  3. HTML 父元素与子元素之间的margin-top问题

    问题: 父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. 代码如下: <div ...

  4. php一些特殊函数的使用实例详解

    <?php /* * PHP Array 函数大全 * * array() 创建数组. 3 array_change_key_case() 返回其键均为大写或小写的数组. 4 array_chu ...

  5. ExtJS笔记 Grids

    参考:http://blog.csdn.net/zhangxin09/article/details/6885175 The Grid Panel is one of the centerpieces ...

  6. 淘宝天猫网站停止支持IE6、IE7浏览器,你还在用xp吗?

    2016年4月14日,是科比正式告别篮球的最后一场球赛.大家都在忙着各种纪念和怀念着看科比打球的青葱岁月.不过已经完美谢幕.而我们今天要说的是微软的IE6.IE7浏览器.淘宝网和天猫商城正式停止支持I ...

  7. c语言-交换两个整数

    使用c来写一个函数来实现交换两个整数. 第一种 一般的方法,引用中间变量,方便快捷. void swap(int *a, int *b) { int tmp = *a; *a = *b; *b = t ...

  8. asp.net mvc 控制器中操作方法重载问题 解决

    Controllers: public ActionResult Index() { return View(db.GuestBooks.ToList()); } // // GET: /Guest2 ...

  9. zepto源码--核心方法7(管理包装集)--学习笔记

    后面应该会有几篇连续介绍关于zepto包装集的文章.涉及的函数较多,就分别介绍,今天介绍几个使用关系获取包装集的方法.prev, next, first, last, siblings, eq pre ...

  10. openstack搭建配置

    安装和配置网络节点vim /etc/sysctl.confnet.ipv4.ip_forward=1net.ipv4.conf.all.rp_filter=0net.ipv4.conf.default ...