来自:http://www.cnblogs.com/woleicom/p/4111030.html css3属性兼容性 /*圆角class,需要设置圆角的元素加上class名称*/ .roundedCorners{ -webkit-border-radius: 10px;/*webkit内核浏览器*/ -moz-border-radius: 10px;/*moz内核浏览器*/ border-radius:20px;/*直接支持css3圆角属性的浏览器(如IE10)*/ }/*配合js使用*/ /…

css3背景颜色渐变属性 兼容性测试基础环境为:windows系统:IE6.0+, Firefox4.0+, Chrome4.0+, Safari4.0+, Opera15.0+ 语法: <linear-gradient>:linear-gradient([ <point>,]? <color-stop>[, <color-stop>]+); <point>:[ left | right ]? [ top | bottom ]? || <a…

CSS可以改进网站的设计并且开拓网站设计更多的可能性,可以令你的网页更具吸引力.对于前端开发者.网站设计师来说,掌握并熟练应用CSS是一项必不可少的技能. 下面列出了一些非常实用的CSS3属性和使用技巧,希望能够为你的开发.设计工作带来一些帮助. 1.  圆角效果 如今的Web设计在不断跟进最新的开发技术,纷纷采用HTML5来开发多样性的Web应用.HTML5的优势之一,就是之前必须用图片实现的元素,现在可以用代码来实现.“border-radius”是实现这一功能的一个重要的属性,可以用来直接…

一.项目中用到一个flex属性,但是应用了flex的父容器只设置了width,没有设置height,此时每一个应用了上面提到的属性的样式的div都重叠在了一起,在IE10,IE11出问题,IE9没有问题.(待深入研究) 二.距离上一次发布<五大主流浏览器 HTML5 和 CSS3 兼容性大比拼>转眼已过去一年,在这一年里,浏览器领域的竞争愈演愈烈.Firefox 成为新的“版本帝”但依然未能摆脱被 Chrome 超越的命运,支持更多标准的 IE10 将随着 Windows 8 在10月底正式发…

转行做前端,上班有一个星期了,什么都不懂,今天学习了几个新的css3属性,记录下来. 注:所有的测试均是在chrome上手机模式测试,与真实的手机环境可能有误差 1:-webkit-tap-heighlight-color:rgba();改变safari 与大部分android机可点击元素,点击时产生的半透明灰色背景 在ios safari 与大部分android机中有效,alpha设置为0时,去掉背景色: 点击是默认状态: 2:   ::selection选择器 w3c school中说明:…

CSS3的box-shadow属性可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. box-shadow属性的浏览器兼容性先来看一个这个属性的浏览器兼容性: Opera: 不知道是从哪个版本开始支持的,我在发这篇文章测试的时候,正好更新了Opera到最新的10.53版本,已经支持box-shadow属性. Firefox通过私有属性-moz-box-shadow支持. Safari和Chrome通过私有属性-webkit-box-shadow支持. 所有IE不支持(不知道IE9…

CSS3的box-shadow属性可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. box-shadow属性的浏览器兼容性先来看一个这个属性的浏览器兼容性: Opera: 不知道是从哪个版本开始支持的,我在发这篇文章测试的时候,正好更新了Opera到最新的10.53版本,已经支持box-shadow属性. Firefox通过私有属性-moz-box-shadow支持. Safari和Chrome通过私有属性-webkit-box-shadow支持. 所有IE不支持(不知道IE9…

一.CSS3实现兼容性渐变背景效果,兼容FF.chrome.IE 渐变效果,现在主流的浏览器FF.Chrome.Opera.IE8+都可以通过带有私有前缀的CSS3属性来轻松滴实现渐变效果,IE7及以下也可以通过滤镜来实现渐变效果(滤镜来实现会消耗大量资源) ?为什么滤镜实现渐变效果会消耗大量资源      呵呵,菜鸟,什么都不懂,就只会百度了.见笑了. 原因是:由于IE内部在解析滤镜,也是通过大量的CPU计算,从而达到滤镜效果,最后再渲染. 二.各浏览器是如何实现渐变效果的 1.CSS3实现渐…

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 我们在上一篇文章中学习了CSS3的选择器,本文来学一下CSS3的一些属性. 颜色 CSS3中,有一种新的表示颜色的方式:RGBA或者HSLA. RGBA.HSLA可应用于所有使用颜色的地方. RGBA 举例: background-color: rgba(0, 0, 255, 0.3); border: 30px solid rgba(0, 255, 0, 0.3…

==================获取======================== 我想到的第一个思路 var test = document.getElementById('test'); console.log(test.style); 然而这种方法并没有什么效果,因为style代表的是行间样式. 我突然想起以前学JS运动,有一个叫做getStyle的方法 function getStyle(obj, name){ if(obj.currentStyle){ return obj.cu…