css3属性整理
浏览器内核:主流内容主要有Mozilla(熟悉的有Firefox,Flock等浏览器)、WebKit(熟悉的有Safari、Chrome等浏览器)、Opera(Opera浏览器)、Trident(讨厌的IE浏览器)
-moz- 针对Mozilla内核的浏览器
-WebKit- 针对WebKit内核的浏览器
-o- 针对Opera浏览器
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)
格式:-moz-linear(类型)-gradient(方向,起点颜色,终点颜色)
颜色最少为俩值方向可以有两个方向 方向可以没有
参数:其共有三个参数,第一个参数表示线性渐变的方向,top是从上到下、left是从左到右,如果定义成left
top,那就是从左上角到右下角。第二个和第三个参数分别是起点颜色和终点颜色。你还可以在它们之间插入更多的参数,表示多种颜色的渐变。如图所示:
IE浏览器用滤镜实现颜色渐变:filter:
progid:DXImageTransform.Microsoft.gradient(GradientType=0,
startColorstr=#1471da, endColorstr=#1C85FB);
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient (GradientType=0,
startColorstr=#1471da, endColorstr=#1C85FB)";}
IE依靠滤镜实现渐变。startColorstr表示起点的颜色,endColorstr表示终点颜色。GradientType表示渐变类型,0为缺省值,表示垂直渐变,1表示水平渐变。
::selection 不解释
自己看效果
::selection {
background: 颜色值;
color:颜色值;
}
::-moz-selection {
background: 颜色值;
color:颜色值;
}
::selection在IE家族中,只有IE9+版本支持,在Firefox中需要加上其前缀“-moz”,查阅相关w3c官方资料,并没有对这个属性的解说资料,只知道这个属性被规纳在CSS的伪类选择器中。
HTML标签建议
html {
font-size: 100%;
overflow-x: hidden;
overflow-y:scroll;
-webkit-tap-highlight-color: transparent;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
height: 100%;
}
图片的缩放在IE7以及IE6下是件很恐怖的事情,将严重影响您的图片质量,欲解决,记得在img标签上加上下面的代码:
img {
-ms-interpolation-mode: bicubic;
}
css3属性整理的更多相关文章
- 常用CSS3属性整理
常用CSS3属性整理 文本 文本超出部分折叠 white-space:nowarp; overflow:hidden; text-overflow:ellipsis word-warp 边界换行 no ...
- 【原】常见CSS3属性对ios&android&winphone的支持
2个月前,我在博文<webapp开发中兼容Android4.0以下版本的css hack>中写过“那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了” ,在 ...
- 如何处理CSS3属性前缀
今天闲来无聊,重新来说说CSS3前缀的问题.在春节前和@一丝姐姐说起Sass中有关于gradient的mixins.姐姐说: 为什么还要用mixin呢?为什么不使用Autoprefixer?使用Aut ...
- CSS3属性 box-shadow 向框添加一个或多个阴影
CSS3属性 利用box-shadow制作网页页眉背景 box-shadow 浏览器支持 IE9+.Firefox 4.Chrome.Opera 以及 Safari 5.1.1 支持 box-shad ...
- CSS3属性transform详解之(旋转:rotate,缩放:scale,倾斜:skew,移动:translate)
CSS3属性transform详解之(旋转:rotate,缩放:scale,倾斜:skew,移动:translate) 在CSS3中,可以利用transform功能来实现文字或图像的旋转.缩放.倾 ...
- 让IE6/IE7/IE8浏览器支持CSS3属性
让IE6/IE7/IE8浏览器支持CSS3属性 一.下载 您可以狠狠地点击这里:ie-css3.htc,这个玩意儿是让IE浏览器支持CSS3表现的关键东东. 二.上面的是什么东西 首先说说.htc文件 ...
- 实用的CSS3属性和使用技巧
CSS可以改进网站的设计并且开拓网站设计更多的可能性,可以令你的网页更具吸引力.对于前端开发者.网站设计师来说,掌握并熟练应用CSS是一项必不可少的技能. 下面列出了一些非常实用的CSS3属性和使用技 ...
- H5、CSS3属性的支持性以及flex
一.项目中用到一个flex属性,但是应用了flex的父容器只设置了width,没有设置height,此时每一个应用了上面提到的属性的样式的div都重叠在了一起,在IE10,IE11出问题,IE9没有问 ...
- 移动端 几个css3属性的练习
转行做前端,上班有一个星期了,什么都不懂,今天学习了几个新的css3属性,记录下来. 注:所有的测试均是在chrome上手机模式测试,与真实的手机环境可能有误差 1:-webkit-tap-heigh ...
随机推荐
- Ajax-jQuery实现
load方法: 对上一篇中的javascript原生实现(数据格式为html),用jqury的post方法进行改造: 下面这句中“h2 a”,实现了对返回内容的选择: $.get()\$.post ...
- mysql绿色版在windows系统中的启动
mysql绿色版在windows系统中的启动 1.下载mysql免安装版 例如:mysql-5.7.11-winx64 2.修改配置文件,my-default.ini名称改为:my.ini,文件里面的 ...
- ios开发入门篇(三):UITableView简介
最近做项目又开始用到了uitableview,温习之余,在这里把uitableview的用法分享一下,有不对的地方欢迎大家提出来. 废话不多说,先创建一个工程,由于Xcode6,去除了创建工程时的空项 ...
- JavaScript之数组对象
Array类型是ECMAScript中最常用的类型了. 一.声明方式 1.使用Array构造函数 var arr1 = new Array(); 如果预先知道要保存数组的数量, 也可以给构造函数传递该 ...
- 结构体的malloc与数组空间
结构体的malloc 如果结构体中有指针,对结构体的malloc 和其指针成员变量的malloc是没有关系的 结构体malloc的是存储自己地址的 忘记了面试常考试的sizeof的几个主要点 ==== ...
- 查找-find -grep
find#.#-name#"*pc"#|#xargs#grep#"Flag" “*.pc”设置要找的文件名grep后面是要找的字符串 #是空格
- HTML5+J2EE实现文件异步上传
P.S. HTML5经过了W3C的8年努力,终于正式推广了.这次升级最大的就是升级了XMLHTTPRequest,让它变成了XMLHTTPRequest Level II(这有啥奇怪的?).这个对象现 ...
- 小技巧:SystemTray中进行操作提示
SystemTray中进行操作提示在wp中应用比较广泛,截图如下. 实现方法也十分简单 1.xaml代码中写入: shell:SystemTray.IsVisible="True" ...
- Excel导入功能
一:前端 <t:dgToolBar title="Excel题库导入" icon="icon-search" onclick="question ...
- php删除html标签的三种解决方法
分享下PHP删除HTMl标签的三种方法. 方法1:直接取出想要取出的标记 <?php //取出br标记 function strip($str) { $str=str_replace(" ...