我想只为三角形制作一个圆角,但我无法制作它.
这是我的 code:
这是我的 code:
.arrow-left { width: 0; height: 0; border-top: 80px solid transparent; border-bottom: 80px solid transparent; border-right: 80px solid blue; }
<div class="arrow-left"></div>
我需要左边的角落圆角,如下图所示:
解决方法
我知道这有点hacky,但我不认为有一个简单的方法来做一个单一的课程.
我所做的就是将一个方框旋转45度,边框半径为10px,然后将其包含在另一个div中,宽度设置为箭头所需的宽度并溢出:隐藏,以便溢出的所有内容都是不可见的.
.arrow-left { position:absolute; width:100px; height:100px; left:50px; background:black; -webkit-transform:rotate(45deg); transform:rotate(45deg); border-radius:10px; } .cover { position:absolute; height:100px; width:40px; overflow:hidden; }
原文地址:https://www.jb51.cc/css/217398.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。