css属性书写顺序分析
我们直接从例子出发
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?speta9');
src: url('fonts/icomoon.eot?speta9#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?speta9') format('truetype'),
url('fonts/icomoon.woff?speta9') format('woff'),
url('fonts/icomoon.svg?speta9#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
这个例子对IE做了兼容,首先看第二个src,因为IE识别不了多属性值(也可以说识别不了‘,’),所以把适应IE的格式放在第一个;再看一下我们为什么写了两个src,这里也是做了一个兼容,因为IE自己的格式也分为IE8以前和IE9适配的格式,大家记住书写一样的属性时,在只能识别一种的浏览器中,另外一种将被忽略,在能适配两种的的浏览器中,后面的会覆盖前面的。
我们再看一个例子
a{
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
这里我们习惯把不带浏览器前缀的放在后面,因为我们想要在所有浏览器统一标准时,我们的通用属性覆盖我们的hack。
css属性书写顺序分析的更多相关文章
- Discuzx系统 CSS 编码规范,CSS属性书写顺序
1. 属性写在一行内,属性之间.属性名和值之间以及属性与“{}”之间须有空格,例如:.class { width: 400px; height: 300px; } 2. 属性的书写顺序: ...
- Mozilla推荐的CSS属性书写顺序及命名规则
传说中的Mozilla推荐 /* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * ...
- CSS属性书写顺序及命名规则
/* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * list-style * ...
- 前端开发--css属性书写顺序
css属性顺序是css良好编码风格的一部分,有助于提高代码可读性,便于发现代码问题,有利于团队合作.(依次排后) example { /*显示属性*/ display: ; visibility: ; ...
- css属性书写顺序(重点)
- css属性编写顺序+mysql基本操作+html细节(个人笔记)
css属性编写顺序: 影响文档流的属性(比如:display, position, float, clear, visibility, table-layout等) 自身盒模型的属性(比如:width ...
- HTML编码规则、CSS属性声明顺序--简介
From AmazeUI:http://amazeui.org/getting-started/html-css-guide HTML 属性顺序 HTML 属性应当按照以下给出的顺序依次排列,确保代码 ...
- css3属性书写顺序
今天写了个小demo想要利用transition 和transform以及transition-delay来实现鼠标移上去的延时动画,结果发现不能实现transition的变化效果.调试后发现只有把 ...
- css样式书写顺序
这里推荐先写显示属性,再写自身属性,再写文字属性:并不代表非得按这个顺序写,但这种写法可以使css结构更清晰易读,修改起来比较方便. 而且在团队项目中能更好地提高效率. //显示属性 display ...
随机推荐
- [Java核心技术笔记]并发
Runnable Runnable接口是函数式接口 //Runnable接口 public interface Runnable { void run(); } //用lambda表达式创建实例 Ru ...
- scrapy -->CrawlSpider 介绍
scrapy -->CrawlSpider 介绍 1.首先,通过crawl 模板新建爬虫: scrapy genspider -t crawl lagou www.lagou.com 创建出来的 ...
- WebApi上传文件
上网搜了下Web Api上传文件的功能,发现都写的好麻烦,就自己写了一个,比较简单,直接上传文件就可以,可以用Postman测试. 简单的举例 /// <summary> /// 超级简单 ...
- Solidity的三种转账方式与比较
转账的3种方式 123 address.transfer()address.send()address.call.value().gas()() 转账transfer 12345678910 func ...
- Linux下搭建ftp服务
Linux下ftp服务可以通过搭建vsftpd服务来实现,以CentOS为例,首先查看系统中是否安装了vsftpd,可以通过执行命令 rpm -qa | grep vsftpd 来查看是否安装相应的包 ...
- 《JAVA程序设计》第四周总结
第四周作业总结 学习内容: 1.根据教材视频学习第五章:子类和继承 2.调试代码和解决问题 3.上周错题 4.代码托管 知识总结 子类:在类的声明中,通过使用关键字extends来定义一个类的子类. ...
- java30
1.类的组合关系 当一个类中的字段是一个类时,就称类依赖于字段这个类,也称这两个类为组合关系 2.快捷键:ctrl+shift+c,多行的// ctrl+shift+/,多行的/-----/ 3.类的 ...
- 2019.02.28 bzoj3527: [Zjoi2014]力(fft)
传送门 fftfftfft菜题. 题意简述:给一个数列aia_iai,对于i=1→ni=1\rightarrow ni=1→n求出ansi=∑i<jai(i−j)2−∑i>jai(i−j ...
- 2019.02.21 bzoj1249: SGU277 HERO 动态凸包(set+凸包)
传送门 题意:动态插入点,维护凸包面积. 思路:用setsetset维护极角序来支持面积查询即可. 然后注意选原点的时候要从初始三个点随机平均系数来避免精度误差. 代码: #include<bi ...
- Python实例浅谈之三Python与C/C++相互调用
一.问题 Python模块和C/C++的动态库间相互调用在实际的应用中会有所涉及,在此作一总结. 二.Python调用C/C++ 1.Python调用C动态链接库 Python调用C库比较简单,不经过 ...