CSS3浏览器私有属性
CSS3的浏览器私有属性前缀是一个浏览器生产商经常使用的一种方式。它暗示该CSS属性或规则尚未成为W3C标准的一部分。因此每种内核的浏览器都只能识别带有自身私有前缀的CSS3属性。我们在书写CSS3代码时,需要在属性前加上浏览器的私有前缀,然后该种内核的浏览器才能识别相应的CSS3属性。例如给一个div设置CSS3的-border-radius-时,chrome浏览器只能识别-webkit-border--radius-(前缀为-webkit-),而firefox浏览器只能识别-moz-border--radius-(前缀为-moz-),IE浏览器只能识别-ms--radius-(前缀为-ms-),opera浏览器只能识别-m-radius-(前缀为-m-)。
例子:
一个CSS3圆角的代码是:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CC圆形</title>
<style>
div{
width:100px;
height:100px;
text-align: center;
vertical-align: middle;
background:green;
-webkit-border-radius: 50%;/*兼容Chrome/Safari*/
-o-border-radius: 50%; /*兼容Opera*/
-moz-border-radius: 50%; /*兼容Firefox*/
-ms-border-radius: 50%; /*兼容IE*/
}
</style>
</head>
<body>
<div></div>
</body>
</html>
对于CSS3某些特性属性的书写,我们都要像上述代码那样做兼容处理。不管我们对浏览器内核前缀有多么的讨厌,我们都不得不每天面对它,否则有些东西不能正常工作,目前还没有形成统一的兼容,所以用到CSS3的一些功能的时候都需要写上,避免出现不兼容的模式。
CSS3浏览器私有属性的更多相关文章
- css3浏览器私有属性前缀使用详解
什么是浏览器私有属性前缀 CSS3的浏览器私有属性前缀是一个浏览器生产商经常使用的一种方式.它暗示该CSS属性或规则尚未成为W3C标准的一部分. 以下是几种常用前缀 -webkit- -moz- -m ...
- 浏览器 私有属性&内核
-moz代表firefox浏览器私有属性 -ms代表IE浏览器私有属性 -webkit代表chrome.safari私有属性 IE使用的是Trident内核,Firefox 使用的是Gecko内核.目 ...
- 摆脱CSS浏览器私有属性-moz, -ms, -webkit
为了兼容各个浏览器之间的私有属性,前端开发人员在写css的时候需要给一些css属性添加多个私有前缀,非常麻烦.这里给大家分享一个简单的方法可以让你以后无需手动给CSS添加私有属性. -moz代表fir ...
- CSS声明各个浏览器私有属性的命名前缀
-moz代表firefox浏览器私有属性-ms代表IE浏览器私有属性-webkit代表chrome.safari私有属性-o代表opera私有属性
- css3浏览器兼容的前缀
-moz代表firefox浏览器私有属性 -ms代表ie浏览器私有属性 -webkit代表safari.chrome私有属性
- 4. CSS新特性之浏览器私有前缀
1. 浏览器私有前缀 浏览器私有前缀是为了兼容老版本的写法,比较新版本的浏览器无需添加 -moz-:代表firefox浏览器私有属性 -ms-:代表ie浏览器私有属性 -webkit-:代表safar ...
- CSS3选择器、低版本解决方案及各浏览器私有前缀
一.基本选择器 通配选择器:* 元素选择器:div.p… ID选择器:#id 类选择器:.className 群组选择器:选择器1,选择器2 主流浏览器全部支持 二.层次选择器 后代选择器: div ...
- CSS3中动画属性transform、transition和animation
Transform:变形 在网页设计中,CSS被习惯性的理解为擅长表现静态样式,动态的元素必须借助于javascript才可以实现,而CSS3的出现改变了这一思维方式.CSS3除了增加革命性的创新功能 ...
- css2和CSS3的background属性简写
1.css2:background:background-color || url("") || no-repeat || scroll || 0 0; css3: backg ...
随机推荐
- Dart运算符条件判断类型转换
/* 1.Dart运算符: 算术运算符 + - * / ~/ (取整) %(取余) 关系运算符 == != > < >= <= 逻辑运算符 ! && || 赋值 ...
- 圣诞节雪花效果,pc端
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- bat实现每天定时执行命令[windows底下每天重启一下Nginx]
--试验通过--Windows环境脚本名称:restart.bat脚本内容: @echo offtaskkill /f /fi "IMAGENAME eq nginx.exe"cd ...
- MongoDB数据表添加字段
db.tshare_a.insert( { "_id" : ObjectId("57172b0f657f8bbb34d70147"), "picUrl ...
- 使用 evo 工具评测 VI ORB SLAM2 在 EuRoC 上的结果
http://www.liuxiao.org/2017/11/%E4%BD%BF%E7%94%A8-evo-%E5%B7%A5%E5%85%B7%E8%AF%84%E6%B5%8B-vi-orb-sl ...
- git如何新建分支
1) 切换到基础分支,如主干 git checkout master 2)创建并切换到新分支 git checkout -b panda git branch可以看到已经在panda分支上 3)更新分 ...
- php面相对象类中成员
类中成员 一个类的内部可以有3种代码:属性.方法.类常量它们统称为“类中成员”. 一般属性 属性就是放在一个类中的变量. 定义形式: 形式1: var $v1 ; //定义不赋值 形式2: var ...
- [学习笔记] 下载、安装、启动 Eclipse(OEPE)
OEPE 的全称是: Oracle Enterprise Pack for Eclipse 截止目前的最新版本是:(12.2.1.9) 下载地址:(需要在甲骨文官网注册一个账户才能下载) https: ...
- Hue,Oozie运行sqoop找不到驱动解决办法
一.前言 平台:CDH 5.13.0 公司在客户那边有个项目需要部署cloudera平台,部署的时候,在这个版本的cdh中,除了基本组件,还选了sqoop2作为数据传输工具,希望能在Oozie中通过工 ...
- [SQL SERVER] - 还原数据库备份(SQL脚本),抛出 "System.OutOfMemoryException" 异常之解决
背景 在 Microsoft SQL Server 2016 的查询窗体中,直接还原备份数据库的 SQL 脚本(99MB),抛出 Cannot execute script 异常: 原因 相关资料说: ...