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. .net 新闻点击量修改,避免恶意刷新

    DataTable dt = bll.GetNewsByID(id);//根据ID获取的新闻详细内容 if (dt != null && dt.Rows.Count > 0) { ...

  2. JAVA6开发WebService (三)——几个概念

    转载自http://wuhongyu.iteye.com/blog/808922 要了解WebService,光能写代码不行啊,这说说WebService最基本的概念. 首先WebService要知道 ...

  3. div自定义的滚动条 (竖直导航条)

    <style type="text/css"> .scrollBar { width: 10px; background-color: #daa520; positio ...

  4. js 检查是否为手机端

    let isMobile = function(){ let userAgentInfo = navigator.userAgent; let Agents = new Array("And ...

  5. IOS第18天(7,CAKeyframeAnimation-图标抖动)

    *** #import "HMViewController.h" #define angle2radian(x) ((x) / 180.0 * M_PI) @interface H ...

  6. centos桌面使用

    firefox添加flash插件 [root@bogon home]# cp libflashplayer.so /usr/lib64/mozilla/pl pl plugins/ plugins-w ...

  7. ng-model和ng-bind区别

    ng-bind has one-way data binding ($scope --> view). It has a shortcut {{ val }} which displays th ...

  8. P1967 货车运输 -60分

    打了一个最大生成树+dfs,60分成功tle #include <bits/stdc++.h> using namespace std; const int maxn = 10005; c ...

  9. 关于HTML5中video标签的奇怪现象

    很多人刚开始学习html5 的时候在使用video标签时会出现这样的情况: 发现video标签在网页中播放时只有声音但是没有图像,如: <!DOCTYPE html> <html&g ...

  10. linux之php

    /usr/local/php/sbin/php-fpm 却无法启动,提示错误: ERROR: failed to load configuration file '/usr/local/php/etc ...