首页 > web前端 > css教程 > CSS3创建多边形clip属性的实例

CSS3创建多边形clip属性的实例

黄舟
发布: 2017-10-23 09:56:20
原创
1840 人浏览过

CSS3创建多边形clip属性的实例

.path1 {
    clip-path: polygon(5px 10px, 16px 3px, 16px 17px);
}
.path2 {
    clip-path: polygon(3px 5px, 17px 5px, 10px 16px);
}
.path3 {
    clip-path: polygon(5px 10px, 16px 3px, 16px 10px, 26px 10px, 26px 3px, 37px 10px, 26px 17px, 26px 10px, 16px 10px, 16px 17px);
}
.path4 {
    clip-path: polygon(5px 10px, 16px 3px, 16px 10px, 36px 10px, 36px 3px, 47px 10px, 36px 17px, 36px 10px, 16px 10px, 16px 17px);
}
.path5 {
    clip-path: polygon(5px 10px, 16px 3px, 16px 9px, 36px 9px, 36px 3px, 47px 10px, 36px 17px, 36px 10px, 16px 10px, 16px 17px);
}
.path6 {
    clip-path: polygon(5px 10px, 16px 3px, 16px 9px, 36px 9px, 36px 3px, 47px 10px, 36px 17px, 36px 11px, 16px 11px, 16px 17px);
}
.path7 {
    clip-path: polygon(5px 11px, 5px 9px, 16px 3px, 26px 3px, 40px 9px, 48px 15px, 48px 5px, 40px 11px, 26px 17px, 16px 17px);
}
登录后复制

clip-path现在改为了clip

以上是CSS3创建多边形clip属性的实例的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板