CSS3浏览器私有属性

时间 2019-11-21

标签 css3 css 浏览器私有属性栏目 CSS 繁體版

原文原文链接

　　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-)。html

　　例子：web

　　一个CSS3圆角的代码是：chrome

<!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的一些功能的时候都须要写上，避免出现不兼容的模式。浏览器