您的位置：首页 > Web前端 > CSS

知识点：CSS实现一个图案

2017-08-23 16:28 274 查看
也是面试中遇到的，要实现这样一个图形：



其实就是使用一个宽高为0的边框实现这个图案，然后再旋转45度。

<div id="box">
<div></div>
</div>


#box{
width:100px;
height:100px;
border-radius:50px;
overflow:hidden;
}
#box>div{
width:0;
height:0;
border: 50px solid;
border-color: red yellow;
transform: rotate(45deg);
}


在线DEMO戳这里
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  css
相关文章推荐
新的分享
章节导航