css3实现直角三角形，直角边为圆角

要使用CSS3创建一个直角三角形，并且直角边有圆角，可以使用以下技巧：使用伪元素来创建三角形，并对伪元素应用圆角样式。

以下是实现这个效果的CSS代码示例：

.triangle {
  position: relative;
  width: 0;
  height: 0;
  border-left: 50px solid transparent; /* 左边直角三角形 */
  border-right: 50px solid transparent; /* 右边直角三角形 */
  border-bottom: 100px solid #333; /* 底边直角三角形 */
  overflow: hidden; /* 隐藏溢出的伪元素 */
}
 
.triangle:after {
  content: '';
  position: absolute;
  top: 0;
  left: -50px; /* 位于左边直角三角形之上 */
  width: 100px; /* 伪元素的宽度 */
  height: 100px; /* 伪元素的高度 */
  background: #333; /* 伪元素的背景色 */
  border-radius: 50%; /* 圆角 */
  transform: rotate(45deg); /* 旋转45度 */
}

HTML结构：

<div class="triangle"></div>

这段代码创建了一个黑色的直角三角形，其直角边被设置成圆角。伪元素通过旋转和设置圆角达到类似于直角三角形的效果。