没看到有参数可以调整这种交界处边界
其实用html + css 也可以实现。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> .pie { width: 300px; height: 300px; border-radius: 50%; display: flex; flex-direction: row; overflow: hidden; position: relative; transform: rotate(-30deg); } .one { background: red; width: 20%; height: 100%; } .two { background: blue; width: 40%; height: 100%; } .three { background: yellow; width: 40%; height: 100%; } .small-box { width: 80%; height: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; border-radius: 50%; } </style> </head> <body> <div class="pie"> <div class="one"></div> <div class="two"></div> <div class="three"></div> <div class="small-box"></div> </div> </body> </html>
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
暂无简介
文章 0 评论 0
接受
发布评论
评论(1)
其实用html + css 也可以实现。