如何从DIV创建一个三角形

Question

我有一个divHTML,里面写着一些文字.
将div通过设置它的创建X,Y坐标和height和width.
我想绘制一个三角形叠加,div这样我的内容就不会丢失.
我不能改变的X,Y坐标为我其他div的定位是基于此div.
使用多重div方法生成三角形似乎也不可行,因为我不确定div我将在哪个文本中写下......

有人可以建议我如何做到这一点..？

Answer 1

您可以使用图像执行此操作,但更有趣的方法是使用div的边框来制作三角形.

.triangle {
     font-size: 0px; 
     line-height: 0%; 
     width: 0px;
     border-bottom: 20px solid #000;
     border-left: 10px solid #000;
     border-right: 10px solid #000;
}

这里的工作原理在这里解释得更清楚了