圆角三角形
汤姆斯·科马斯（Tomsz Comasz）
我在CSS中创建三角形时遇到问题。如何制作带有圆角的三角形？我必须做点喜欢的事情
G-西里尔
rotate+overflow会做（带有一个额外的元素或一个伪元素）：
.tr {
height:40px;
width:40px;
overflow:hidden;
transform:scale(1,1.2);/* increase visual height */
}
.tr div {/* could be a pseudo */
width:70%;
height:70%;
float:right;
background:#C20009;
transform:rotate(-45deg);
box-shadow: 0 0 1px, inset 0 1px 1px , inset 5px -5px 5px rgba(0,0,0,0.3);
transform-origin: top right;
border-radius : 8px 0 0 0 /* and the rounded corner to finish */
}<div class="tr">
<div></div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
绘制带有圆角的三角形
- 2
CSS圆角三角形问题
- 3
圆角三角形右边框css
- 4
直角三角形的实现
- 5
计算锐角三角形
- 6
php - 直角三角形
- 7
重叠三角形
- 8
for循环的三角形
- 9
渐变三角形
- 10
拖放三角形
- 11
纹理三角形
- 12
检查三角形是否为直角三角形
- 13
圆到圆角的三角形（菜单按钮切换）
- 14
将CAShapeLayer圆形动画为圆角三角形
- 15
纯CSS标签div，带有圆角三角形指针
- 16
CSS负三角形，带有倒圆角
- 17
如何使用SVG以编程方式绘制带有圆角的三角形？
- 18
纯CSS标签div，带有圆角三角形指针
- 19
圆到圆角的三角形（菜单按钮切换）
- 20
将三角形拆分为较小的三角形
- 21
三角形CSS中的三角形
- 22
如何获得AABB三角形的三角形？
- 23
寻找三角形的第三坐标
- 24
C程序检测直角三角形
- 25
如何使用Javascript数学库计算直角三角形的角度？
- 26
使用JavaScript计算直角三角形的边？
- 27
直角三角形的长度（Java Eclipse）：用户输入图
- 28
Java：显示由字符组成的奇数直角三角形
- 29
Codechef和直角三角形的斜率方法
我来说两句