码迷,mamicode.com
首页 > Web开发 > 详细

css属性书写顺序分析

时间:2016-07-22 21:22:29      阅读:156      评论:0      收藏:0      [点我收藏+]

标签:

  我们直接从例子出发

@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属性书写顺序分析

标签:

原文地址:http://www.cnblogs.com/shytong/p/5697056.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!