css三角形里面放数字 |css 超出部分自动换行

.triangle{
width: 0;
height: 0;
border-top: 30px solid #ffcc00;
border-right: 30px solid transparent;
border-left: 30px solid transparent;
position: relative;
}
.triangle:before{
content: "1";
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
color: #fff;
}

上面的代码中，大家首先定义了一个三角形的样式。三角形的宽度和高度都为0，通过调整border的样式来让其显示出来。同时，为了能够让数字显示在三角形的中心位置，大家需要给三角形添加position:relative属性，同时在其:before伪元素中定义数字的样式，使其居中显示。

以上代码仅作为简单的示例，实际中可以通过添加其他样式实现更精细的效果。比如，可以为三角形添加背景色、阴影、圆角等。同时也可以通过修改三角形的大小、border样式等来满足不同的需求。