git 裁切_图片裁切.html

Document

div{

width:100px;height:100px;padding:30px;margin:50px auto;

background:url(img/2.jpg) no-repeat;

border:50px solid rgba(0, 0, 0, 0.2);display:inline-block;

}

div:nth-child(1){background-clip:border-box;}/*border以外的图像被裁掉*/

div:nth-child(2){background-clip:padding-box;}/*padding以外的图像被裁掉*/

div:nth-child(3){background-clip:content-box;}/*content以外的图像被裁掉*/

/*使用图片作为文字的填充色效果*/

div:nth-child(4){

font-size: 40px;font-weight: bold;

/*下面两句代码必须同时出现，才能达到效果*/

-webkit-text-fill-color: transparent;

-webkit-background-clip:text;

}

图片裁切

一键复制

编辑

Web IDE

原始数据

按行查看

历史