CSS可以让我们通过定义一些简单的形状来让网页内容更加丰富，其中三角形也是常用的一种形状，那么怎么用CSS来定义一个三角形呢？

// 定义下三角.triangle-down {width: 0;height: 0;border-left: 20px solid transparent;border-right: 20px solid transparent;border-top: 20px solid #000;}// 定义上三角.triangle-up {width: 0;height: 0;border-left: 20px solid transparent;border-right: 20px solid transparent;border-bottom: 20px solid #000;}// 定义左三角.triangle-left {width: 0;height: 0;border-top: 20px solid transparent;border-right: 20px solid #000;border-bottom: 20px solid transparent;}// 定义右三角.triangle-right {width: 0;height: 0;border-top: 20px solid transparent;border-left: 20px solid #000;border-bottom: 20px solid transparent;}

以上代码演示了如何使用CSS的border属性定义出四个方向的三角形，其中关键点在于使用transparent让边框消失，只留下一个三角形的形状，同时可使用不同的颜色或渐变色来填充三角形内部，从而达到更好的视觉效果。

需要注意的是，定义三角形时要确保其宽度和高度均为0，否则会产生意外的效果，如显示出一个类似于矩形的形状。此外，因为三角形的定义是基于边框的，因此需要调整边框的大小和颜色来达到理想的效果。