CSS中浏览器开发商特定的CSS属性
浏览器制造商(像Microsoft、Mozilla等,还有WebKit的后台人员等)通常会为他们的浏览器增加新的功能来测试新的特性,
或者实现一直在考虑但还没有得到标准组织批准的CSS扩展。在这些情况下,开发商会创建类似这样的CSS属性:
-moz-transform: 第一个是短横线"-";第二个是开发商标识符,moz指Mozill;后面是一个短横线"-";最后是属性
通常可以在各个浏览器的开发文档和发行说明中找到这些开发商特定的属性,
或者可以加入与各浏览器开发过程相关的论坛,从中可以了解到开发商特定的属性。
例如:
div{
transform: rotate(45deg); // 通用属性,以保证属性得到支持,或者至少将来得到支持
-webkit-transform: rotate(45deg); //safari chrome
-moz-transform: rotate(45deg); //Mozilla
-o-transform: rotate(45deg); //Opera
-ms-transform: rotate(45deg); //IE
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
#box{
position:absolute;
top:100px;
left:200px;
width:200px;
height:200px;
background-color:#ff0000;
transition: transform 2s; /* transition属性指出:如果transform属性的值改变,要在指定的实际内从当前transform值过度到新的transform值 */
-webkit-transition: -webkit-transform 2s;
-moz-transition: -moz-transform 2s;
-o-transition: -o-transform 2s; /*
transition属性值也是一个属性,在这里transition属性值为transform,另外还有一个持续的时间(duration),即2s。
指定的属性值改变是,transition会使这个变化在指定的时间内完成,这就是产生一个中动画效果。还可以对其他CSS属性
完成过度,如width或者opacity。
*/
}
/* 当鼠标悬停时,div旋转45度 */
#box:hover{
transform:rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
}
</style>
</head>
<body>
<div id="box"></div>
</body>
</html>
CSS中浏览器开发商特定的CSS属性的更多相关文章
- css中的字体及文本相关属性
css中的字体及文本相关属性 1.字体相关属性 字体主要可以设置color.font-family.font-size.font-size-adjust.font-stretch.font-style ...
- css hack 浏览器携带自身特有的属性 (二)
css hack 浏览器携带自身特有的属性,才是我们真正要解决的css 兼容问题. 这里只是分享思路. 举例子: 1 outline,尤其是一些 自带继承特性的属性.这里指的是 隐性的inherite ...
- CSS中的盒子模型与 box-sizing 属性
盒子模型是css中一个重要的概念,是开发网页必须要用的布局方法.盒子模型有两种,分别是标准 w3c 盒子模型和 ie 盒子模型. 标准 w3c 盒子模型:包括 magin(外边距).border(边框 ...
- CSS中 Padding和Margin两个属性的详细介绍和举例说明
代码示例: <!doctype html> <html lang="en"> <head> <meta charset="UTF ...
- CSS中padding、margin、bordor属性详解
一.图解CSS padding.margin.border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以 ...
- CSS中控制换行的四种属性
一.white-space 可以实现HTML中PRE标签的效果,以及单元格的noWrap效果,点此查看示例. Example Source Code 语法: white-space : normal ...
- css中的position:relative和absolute 属性
语法: position : static | absolute | fixed | relative 取值: static :默认值.无特殊定位,对象遵循HTML定位规则 absolute :将对象 ...
- css中可继承和不可继承属性
一.无继承性的属性 1.display:规定元素应该生成的框的类型 2.文本属性: vertical-align:垂直文本对齐 text-decoration:规定添加到文本的装饰 text-shad ...
- 解决谷歌浏览器设置font-family属性不起作用,(css中设置了font-family:没有用)css字体属性没用
嗯,这个问题百思不得解.其他的浏览器器都没问题,在谷歌上就不行,网上找了很多,都没效果,后才发现,当然同样的问题可能错不一样的地方,我的解决方案: 感觉主要原因是自己也没查到,乱改一堆,就OK啦: 1 ...
随机推荐
- 基于服务(Web Service)的文件管理Winform程序实现
1. 描述 面向服务的体系结构(SOA)是一个组件模型,它将应用程序的不同功能单元(称为服务)通过这些服务之间定义良好的接口和契约联系起来.接口是采用中立的方式进行定义的,它应该独立于实现 ...
- bzoj1091: [SCOI2003]切割多边形
Description 有一个凸p边形(p<=8),我们希望通过切割得到它.一开始的时候,你有一个n*m的矩形,即它的四角的坐标分别为(0,0), (0,m), (n,0), (n,m).每次你 ...
- Lua学习---Lua的控制结构
前言 由于之前有c/c++.javascript基础,所以学Lua的时候喜欢拿来和前面的语言比较,这里主要和C比较 1.if...else Lua的if语句格式: if 条件 then 条件成立,运行 ...
- [SPI&I2C]I2C和SPI协议介绍
IIC vs SPI 现今,在低端数字通信应用领域,我们随处可见IIC (Inter-Integrated Circuit) 和 SPI (Serial Peripheral Interface)的身 ...
- Hololens开发笔记之连接PC实现资源共享
官网原文介绍:https://developer.microsoft.com/en-us/windows/holographic/using_the_windows_device_portal Hol ...
- 集合类 toArray(T[])
HashSet<String> deDupe = new LinkedHashSet<>(Arrays.asList(origParams.getParams(paramNam ...
- .Net Enum
/// <summary> /// 将enum转换成List<Model.Models.SelectViewModels>,即html的select标签使用的数据 /// &l ...
- js输出到控制台
console.log(object[, object, ...])在控制台输出一条消息.如果有多个参数,输出时会用空格隔开这些参数. 第一个参数可以是一个包含格式化占位符输出的字符串,例如: con ...
- win7双系统安装ubuntu并配置常用软件
首先在win7下磁盘清理出来空间具体方法找度娘就行了. 下面开始准备安装: 1.下载easyBCD 2.打开:添加新条目--NeoGub--安装 3.点击配置 修改menu.lst title In ...
- oracle 查询执行过的SQL语句
SELECT * FROM v$sqlarea t WHERE t.FIRST_LOAD_TIME between '2016-12-23/16:03:00' and '2016-12-23/16:0 ...