Q
左半圆边框
0
A
回答
1
边框半径可以使用::after
CSS伪元素这一点。以下是示例fiddle。希望这可以帮助你。
.link {
height: 100px;
width: 100px;
background: red;
position: relative;
overflow: hidden;
}
.link::after{
content: "";
height: 80%;
background: #fff;
width: 20px;
position: absolute;
top: 10%;
left: -10px;
border-radius: 20px;
transition: all .35s;
opacity: 0;
}
.link:hover::after{opacity:1}
<div class="link"></div>
检查这个link。您可以从此处更多地了解CSS伪元素。
1
尝试使用这样
div {
width: 10px;
height:40px;
background-color: black;
border-top-right-radius: 6px;
border-bottom-right-radius:6px;
}
<div></div>
+0
您认为可以在左侧留下切割部分吗?也许玩的位置? – davidbonachera
+0
只是将'border-top-right-radius'替换为'border-left-left-radius'和'border-bottom-right-radius'为'border-bottom-left-radius' – GvM
相关问题
- 1. 带边框半径的多线圆角
- 2. Highcharts:绘图边框的圆角半径
- 3. React Native中的椭圆边框半径
- 4. 圆角边框使用半径
- 5. 使用边框半径绘制圆圈
- 6. 如何向圆角图像添加圆角边框(使用边框半径圆角)
- 7. 圆角边框
- 8. CSS3边框半径
- 9. CSS - 边框半径
- 10. CSS切割半右上边框和半右上边框
- 11. 问题的边界半径圆角
- 12. 在Cocoa中创建半透明,圆角的边框窗口?
- 13. CSS3边框半径和更大的圆角DIV在DIV
- 14. 在WPF Expander控件上更改边框的圆角半径?
- 15. CSS3 - 如何在矩形上创建圆形边框半径?
- 16. 边框半径圆角没有出现在打印
- 17. 边框半径产生日食,需要90度圆角。 CSS
- 18. 使用边框半径时扭曲的圆圈
- 19. LimeJS圆形边框
- 20. JavaScript:设置边框半径
- 21. 围绕div的半边框
- 22. ToolbarAndroid徽标边框半径
- 23. Webkit边框半径问题
- 24. 边框半径出血
- 25. CSS3边框半径和IE9
- 26. UIButton半透明边框
- 27. 位于大圆半径边缘的D3小圆圈
- 28. Android的圆形边框颜色左上角只有dinamically
- 29. 在页面的边缘/边上的半圆链接
- 30. 倒圆形的边框css
哦,这很完美,我需要学习如何在/之前使用元素,以便我不需要在我的整个列表中添加一个元素。完善。 – davidbonachera
高兴地帮助你。 – Sasith