zoukankan      html  css  js  c++  java
  • 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的一些功能的时候都需要写上,避免出现不兼容的模式。

  • 相关阅读:
    读《梦断代码》有感
    The Third Group Meeting!
    第一次课程作业项目报告
    第四次读后感
    个人作业进度(五)
    个人作业进度(四)
    个人作业进度(三)
    个人进度(二)
    个人作业进度(一)
    java中类的封装与继承
  • 原文地址:https://www.cnblogs.com/songtianfa/p/11209140.html
Copyright © 2011-2022 走看看