在java中画背景图片_求助,这张背景图能否用css画出来啊?

基础实现(去搜下 扇形菜单),剩下就是调整参数和细节处理,我就不弄了

a85bba95a7bfbd2e3cea2be83f077743.png

Light

.frame {position:relative;margin:200px;width:200px;height:400px;box-shadow:0 0 0 1px #F00 inset;overflow:hidden;}

.frame .p {position:absolute;display:none;width:200px;height:200px;top:200px;left:100px;background-color:rgba(255,196,196,0.5);transform-origin:left top}

.frame .p:nth-child(2n+1) {background-color:rgba(196,196,255,0.5);}

.frame .p00 {display:block;transform:rotate(0deg) skew(60deg);}

.frame .p01 {display:block;transform:rotate(30deg) skew(60deg);}

.frame .p02 {display:block;transform:rotate(60deg) skew(60deg);}

.frame .p03 {display:block;transform:rotate(90deg) skew(60deg);}

.frame .p04 {display:block;transform:rotate(120deg) skew(60deg);}

.frame .p05 {display:block;transform:rotate(150deg) skew(60deg);}

.frame .p06 {display:block;transform:rotate(180deg) skew(60deg);}

.frame .p07 {display:block;transform:rotate(210deg) skew(60deg);}

.frame .p08 {display:block;transform:rotate(240deg) skew(60deg);}

.frame .p09 {display:block;transform:rotate(270deg) skew(60deg);}

.frame .p10 {display:block;transform:rotate(300deg) skew(60deg);}

.frame .p11 {display:block;transform:rotate(330deg) skew(60deg);}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值