• CSS3之background-clip


    1、属性简介

         background-clip:padding|border|content|text|!important


    2、兼容性

    (1)IE6、7、8不兼容

    (2)火狐3.0以上兼容

    (3)Chrome 2.0.x兼容


    3、属性实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>CSS3之background-clip</title>
    <style type="text/css">
        body{
    		background-color:#FCC;
    		60%;
    		height:200px;
    		font-size:24px;
    		font-weight:bolder;
    	}
    	div{
    		background:#C6F url(image.jpg);
    		background-color:#9FF;
    		100%;
    		height:100%;
    		
    		-moz-background-clip:padding;
    		-webkit-background-clip:padding;
    		
    		-moz-background-inline-policy: -moz-initial;
    		
    		/*
    		-moz-background-clip:border;
    		-webkit-background-clip:border;
    		
    		-moz-background-clip:!important;
    		-webkit-background-clip:!important;
    		
    		-webkit-background-clip:content;
    		-webkit-background-clip:text;*/
    		
    		
    	}
    </style>
    </head>
    
    <body>
      <div>
         CSS3之background-clip
      </div>
    </body>
    </html>
    

    4、运行结果


  • 相关阅读:
    ext DateTime.js在ie下显示不全
    js 获得每周周日到周一日期
    近十年one-to-one最短路算法研究整理【转】
    虚函数(实现多态)
    函数调用机制2
    函数调用机制
    面向对象的三大特性
    矩阵类c++实现
    矩阵求逆c++实现
    解决文件大小上传限制
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13315369.html
Copyright © 2020-2023  润新知