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 ...
随机推荐
- SQL Server2008新特性Filesteam的使用
Filesteam是SQL Server2008的新特性,它结合了SQL Server和NTFS文件系统,为Blob类型的数据提供了比较高效的存储和访问方案.我们最近的一个项目就是采用SQL Serv ...
- 第六十六篇、OC_Sqlite数据库操作
#import <Foundation/Foundation.h> #import <sqlite3.h> #define kFilename @"data.sqli ...
- OC2_ARC MRC混合编程
// // main.m // OC2_ARC MRC混合编程 // // Created by zhangxueming on 15/6/19. // Copyright (c) 2015年 zha ...
- (转)使用Visual Studio 2015开发Android 程序
环境配置: 操作系统:win 7 64位 IDE:Visual Studio 2015 SDK:installer_r24.3.3-windows 安装前提: 编辑hosts文件(在附件可下载)因为安 ...
- Javascript基本格式
Javascript基本格式 ① JavaScript区分大小写 只要一门语言是面向对象的,其都是区分大小写,所以在Javascript中,变量小i与变量I是两个完全不同的变量 ② JavaScrip ...
- 绝对URL和相对URL
什么是URL? 应用举例:可以是图片等资源地址,浏览器地址栏的网址等等 Uniform Resource Locator 统一资源定位符 http://www.123.com/infor/index. ...
- 【leetcode】5. Longest Palindromic Substring
题目描述: Given a string S, find the longest palindromic substring in S. You may assume that the maximum ...
- 2016年11月ACM/ICPC亚洲区北京赛赛后总结
2016年11月12到11月13为期两天的比赛,这是我们这个对第一次去打亚洲区域赛,经过这次比赛,我认识到了自己与别人的差距,也许我们与别人的起点不同,但这不是理由. 这次的比赛12号的热身赛两点开始 ...
- Google的小秘密
google有计算器的功能,例如在google中搜索25*25.lg(13)等,看会出现什么样的结果. http://www.google.com/microsoft 微软风格的入口 http: ...
- jquery 点击查看,收起特效
<div class="all"> <p><a href="javascript:;" id="onvk"&g ...