CSS3常用属性浏览器兼容前缀
1、检测网站https://gsnedders.html5.org/outliner/
2、查询是否支持前缀http://caniuse.com
3、border-radius\box-shadow\opacity这几个一般前缀-webkit-和-moz-基本就可以了
eg: -webkit-border-radius:xxxx;
-moz-border-radius:xxxx;
4、text-shadow不需要加前缀。IE10+支持,其他基本支持
5、text-overflow只需加前缀-o-,也可以不加
6、text-stroke文本描边、text-fill-color文本填充,试验阶段基本不使用,加前缀-webkit-
7、liner-gradient加前缀-webkit-\-moz-,radial-gradient
8、border-image:ul() slice/width/outer round;加前缀-webkit-\-moz-\-o-
9、transform: translate(x,y) scale(放大倍数) rotate(旋转角度) skew(倾斜deg);加前缀-webkit-\-moz-\-o-\-ms-
10、transform-origin:left top;//或者xy值加前缀-webkit-\-moz-\-o-\-ms-
11、transform:translate3d(x,y,z) scale3d(x,y,z) rotate3d(x,y,z,a) perspective(长度值);或者 transform:translateZ(z) scaleZ(z) rotateX(a) rotateY(a) rotateZ(a) perspective(长度值);要配合属性transform-style:perspective-3d/flat(2d效果);
CSS3常用属性浏览器兼容前缀的更多相关文章
- JS控制CSS3,添加浏览器兼容前缀
不同浏览器对于有些css3属性名字定义的时候,会带上特有的前缀,所以在css编写的时候,经常会一个属性写多个不同的前缀进行兼容.比如: div { transform: rotate(30deg); ...
- css3 background-size属性--ie兼容
css3 background-size属性--ie兼容 safari浏览器对background-size 属性显示原始大小 background-size: cover not working o ...
- web 开发:CSS3 常用属性——速查手册!
web 开发:CSS3 常用属性——速查手册! CSS3 简介:http://www.runoob.com/css3/css3-intro.html 1.目录 http://caniuse.com/ ...
- CSS3常用属性及效果汇总
本文转载于<https://blog.csdn.net/lyznice/article/details/54575905> 一.2D效果属性 要使用这些属性,我们需要通过 transfor ...
- webpack3中使用postcss-loader和autoprefixer给css3样式添加浏览器兼容
1.在webpack中需要处理css必须先安装如下两个loader npm install --save-dev css-loader style-loader 2.要处理sass和添加浏览器前缀需要 ...
- CSS3常用属性(边框、背景、文本效果、2D转换、3D转换、过渡、有过渡效果大图轮播、动画)
CSS3边框: 1.CSS3圆角:border-radius 属性--创建边框线的圆角 <body style="font-size:24px; color:#60F;"& ...
- CSS3常用属性
CSS是我们常用的控制网页样式和布局的一种标准. CSS3是最新的CSS标准. CSS3被拆分为"模块",旧的规范也已经拆分为小的块,同时还增加了新的属性. 一些比较重要的CSS3 ...
- CSS/CSS3常用的样式兼容,样式总结
这篇文章这篇文章主要介绍了css中常用但是又难记的样式作为总结,方便大家学习和使用.包括了‘单行缩略号‘.’css圆角兼容'.‘元素阴影’,‘border取消宽度影响’,‘css3的背景渐变’,‘cs ...
- css3各个属性的兼容
1.transition:IE10. Firefox.Opera.Chrome支持: Safari支持替代的-webkit-transition属性: 2.animation: IE10.FIrefo ...
随机推荐
- (linux)INIT_WORK和INIT_DELAYED_WORK详解
朋友,你相信,一只蝴蝶在北京拍拍翅膀,将使得纽约几个月后出现比狂风还厉害的龙卷风吗?看过那部经典的影片蝴蝶效应的朋友们一定会说,这不就是蝴蝶效应吗.没错.蝴蝶效应其实是混沌学理论中的一个概念.它是 ...
- java24点算法
输入任意的四个数,求出所有能得到二十四点的算式,不过我是菜鸟,可能性能方面不好,希望各位多多指教1. [代码][Java]代码 import java.util.ArrayList;impo ...
- poj 1789 Truck History 解题报告
题目链接:http://poj.org/problem?id=1789 题目意思:给出 N 行,每行7个字符你,统计所有的 行 与 行 之间的差值(就是相同位置下字母不相同),一个位置不相同就为1,依 ...
- 第五届蓝桥杯C++B组省赛
1.啤酒和饮料 2.切面条 3.李白打酒 4.史丰收速算 5.打印图形 6.奇怪的分式 7.六角填数 8.蚂蚁感冒 9.地宫取宝 10.小朋友排队
- hdu 4463 Outlets(最小生成树)
题意:n个点修路,要求总长度最小,但是有两个点p.q必须相连 思路:完全图,prim算法的效率取决于节点数,适用于稠密图.用prim求解. p.q间距离设为0即可,最后输出时加上p.q间的距离 pri ...
- Opencv函数setMouseCallback鼠标事件响应
用户通过鼠标对图像视窗最常见的操作有: 1. 左键单击按下 2. 左键单击抬起 3. 左键按下拖动 4. 鼠标指针位置移动 单次单击操作响应事件及顺序 Opencv中setMouseCallback( ...
- SQL查询速度
查询速度 https://www.cnblogs.com/ZaraNet/p/9558272.html 影响你的查询速度的原因是什么? 网速不给力,不稳定. 服务器内存不够,或者SQL 被分配的内存不 ...
- ES6之拷贝对象
function copyObject(orig) { var copy = Object.create(Object.getPrototypeOf(orig)); //创建一个新的原型对象 copy ...
- 【转】Chrome headless 模式
原文地址: http://www.cnblogs.com/fnng/p/7797839.html 我们在通过Selenium运行自动化测试时,必须要启动浏览器,浏览器的启动与关闭必然会影响执行效率,而 ...
- A. Transformation: from A to B
time limit per test 1 second memory limit per test 256 megabytes input standard input output standar ...