(转)css3前缀
CSS3的前缀是一个浏览器生产商经常使用的一种方式。它暗示该CSS属性或规则尚未成为W3C标准的一部分。
看看都有哪些前缀:
- -webkit(chrome)
- -moz(firefox)
- -ms(ie)
- -o(opera)
举例来说,一个CSS3旋转的代码是:
- -webkit-transform:rotate(-3deg);
- -moz-transform:rotate(-3deg);
- -ms-transform:rotate(-3deg);
- -o-transform:rotate(-3deg);
CSS3前缀+标准代码的顺序
既然CSS3代码中(暂时)需要写上这么多前缀,那么他们的顺序是如何的呢?
答案在下面↓
是先写私有的CSS3属性,再写标准的CSS3属性。
- -webkit-transform:rotate(-3deg);
- -moz-transform:rotate(-3deg);
- -ms-transform:rotate(-3deg);
- -o-transform:rotate(-3deg);
- transform:rotate(-3deg);
去掉CSS3前缀
什么时候我们可以去掉一个属性的CSS3前缀呢?
答案还在下面↓
当一个属性成为标准,并且被Firefox、Chrome等浏览器的最新版普遍兼容的时候。
- 以border-radius为例:
- -moz-border-radius: 12px;
- -webkit-border-radius: 12px;
- border-radius: 12px;
FF4、Saf5以及Chrome都支持border-radius属性了,我们就没有必要写以上两条了,代码变成:
- border-radius: 12px;
(转)css3前缀的更多相关文章
- 第 20 章 CSS3 前缀和 rem
学习要点: 1.CSS3 前缀 2.长度单位 rem 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 在发展中实行标准化的一些问题,重点探讨 CSS3 中新属性前缀问题和新的单位 rem. 一 ...
- 第七十七节,CSS3前缀和rem长度单位
CSS3前缀和rem长度单位 学习要点: 1.CSS3前缀 2.长度单位rem 本章主要探讨HTML5中CSS在发展中实行标准化的一些问题,重点探讨CSS3中新属性前缀问题和新的单位rem. 一 CS ...
- 介绍一款自动给添加不同浏览器CSS3前缀的插件~Autoprefixer(附其他前端开发插件)
正文 自动给CSS文件添加不同浏览器的CSS3前缀:Autoprefixer 安装 只需兼容主流浏览器 正常情况使用:(在书写完的CSS样式文件中,按F1,选择Autoprefixer CSS) 这时 ...
- webpack快速入门——CSS进阶:自动处理CSS3前缀
为了浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀.目的就是让我们写的页面在每个浏览器中都可以顺利运行. 1.安装 cnpm i postcss-loader aut ...
- 主流浏览器内核,以及CSS3前缀识别码
现在国内常见的浏览器有:IE.Firefox.QQ浏览器.Safari.Opera.Google Chrome.百度浏览器.搜狗浏览器.猎豹浏览器.360浏览器.UC浏览器.遨游浏览器.世界之窗浏览器 ...
- html5--6-24 css3前缀
html5--6-24 css3前缀 学习要点 掌握css3前缀的使用 CSS3目前很多新增属性尚未被W3C列为标准,对这些暂时未被公布为标准的属性,各家浏览器会在属性前加上前缀词,也将其称之为浏览器 ...
- CSS3前缀
我们经常会遇到写的有些css3属性会在不同的浏览器下呈现不兼容的情况,那是因为浏览器内核不同而导致的兼容性问题. 首先我们需要先了解一下目前的几种现代浏览器的内核,主流内容主要有Mozilla(熟悉的 ...
- webpack打包css自动添加css3前缀
为了浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀.目的就是让我们写的页面在每个浏览器中都可以顺利运行. 1.安装 cnpm i postcss-loader aut ...
- CSS3前缀自动补全方案和插件
第一种方法:prefix free,js插件,大小2kb,直接导入,无需任何浏览器兼容前缀 <script src="prefixfree.min.js"></s ...
随机推荐
- 卡特兰数 BZOJ3907 网格 NOIP2003 栈
卡特兰数 卡特兰数2 卡特兰数:主要是求排列组合问题 1:括号化矩阵连乘,问多少种方案 2:走方格,不能过对角线,问多少种方案 3:凸边型,划分成三角形 4:1到n的序列进栈,有多少种出栈方案 NOI ...
- 【转载】 Linux用户态和内核态
[说明]转载自 http://my.oschina.net/liubin/blog/27795 究竟什么是用户态,什么是内核态,这两个基本概念以前一直理解得不是很清楚,根本原因个人觉得是在于因为大部分 ...
- 开启sa账户以及如何用JDBC进行连接
做实验需要用Java与SQL Server连接,因为使用的 SQL 2008 Express Edition 是基于 Visual Studio2010 安装包安装时一起安装的,所以为了方便数据库的操 ...
- java ee@ Myeclipse 2015 stable 1.0 完美破解方法
Myeclipse 2015 stable 1.0 完美破解方法 破解步骤: 使用以前的注册机算号,版本选择Blue即可,后续可解锁Spring高级功能,即Bling的所有功能全部具备 1.1 进入m ...
- Chrome 浏览器跨域和安全访问问题 使用 chrome的命令行标记:disable-web-security 参数联调线上数据
做前端的,用Ajax获取数据,是常有的事情,同域下自然没问题了,如果是不同域获取数据,浏览器就有个同源策略的限制. 如图: Origin * is not allowed by Access-Cont ...
- python 使用模块
Python本身就内置了很多非常有用的模块,只要安装完毕,这些模块就可以立刻使用. 我们以内建的sys模块为例,编写一个hello的模块: #!/usr/bin/env python # -*- co ...
- 如果将synthesize省略,语义特性声明为assign retain copy时,自己实现setter和getter方法
如果将synthesize省略,并且我们自己实现setter和getter方法时,系统就不会生成对应的setter和getter方法,还有实例变量 1,当把语义特性声明为assign时,setter和 ...
- .NET/C# 类构造函数中this的用法 (转)
在C#中this用来指代当前对象,用于当成员函数中的形参名跟成员变量名一致时,进行区分. 但this不仅仅只有这一作用,this还可以如下这样用: class class1 { private int ...
- 对struts2的基本知识和环境的搭建(配图解)
Struts2的优点: Struts2是由webwork2发展过来的.属于无侵入式设计.而struts1是入侵是设置. Struts2跟servlet API没有紧密的联系. struts2提供了拦截 ...
- SQLMAP实用实例(转)
sqlmap使用笔记:http://wenku.baidu.com/view/8c507ffcaef8941ea76e055e.html BT5下使用SQLMAP入侵加脱裤:http://www.m ...