我想只为三角形制作一个圆角,但我无法制作它.
这是我的 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>
我需要左边的角落圆角,如下图所示：@H_301_8@
解决方法
我知道这有点hacky,但我不认为有一个简单的方法来做一个单一的课程.
我所做的就是将一个方框旋转45度,边框半径为10px,然后将其包含在另一个div中,宽度设置为箭头所需的宽度并溢出：隐藏,以便溢出的所有内容都是不可见的.@H_301_8@
http://jsfiddle.net/9D3Zn/5/@H_301_8@
- .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;
- }
