怎么用css写出来一个三角形

### 回答1：

使用CSS绘制三角形的方法之一是使用"border"属性。 例如：div {
width: 0;
height: 0;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-bottom: 30px solid red;
}

### 回答2：
要用CSS写出一个三角形，可以通过调整元素的宽度、高度和边框来实现。

一个常用的方法是使用边框来画出三角形。

首先，创建一个具有零宽度和高度的`div`元素，并设置其边框的颜色和样式。例如：

.triangle {
  width: 0;
  height: 0;
  border-left: 50px solid transparent;  //设置左侧边框颜色为透明
  border-right: 50px solid transparent; //设置右侧边框颜色为透明
  border-bottom: 50px solid red;  //设置底部边框颜色为红色
}

在这个例子中，设置了一个宽度和高度为零的`div`元素，并通过设置边框的颜色和样式来画出一个红色的三角形。

你可以根据需要，调整`width`、`height`和边框的颜色和样式来得到不同形状和颜色的三角形。

此外，还有其他通过旋转或使用伪元素`before`和`after`等方式来实现三角形的方法，但使用边框是最常见和简单的方法之一。

通过以上的CSS代码，你可以在HTML中使用`<div class="triangle"></div>`来创建一个三角形，然后根据需要在页面上进行样式调整。

### 回答3：
要用CSS写出一个三角形，可以使用CSS的border属性来实现。下面是一个简单的方法：

1. 创建一个元素，可以是div、span或其他块级或内联元素。
2. 设置元素的宽度和高度为0像素。
3. 设置元素的边框样式和颜色。
4. 使用border-width属性设置三角形的大小。将左边和右边边框的宽度设置为0，将下边边框的宽度设置为三角形的高度，例如10像素。
5. 设置边框的颜色和样式。
6. 通过旋转元素来调整三角形的方向。可以使用transform属性的rotate()函数，例如rotate(45deg)，将元素以45度的角度顺时针旋转。

示例代码如下：

<style>
  .triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px; /* 上、右、下、左 */
    border-color: transparent transparent #000 transparent; /* 上、右、下、左 */
    transform: rotate(45deg);
  }
</style>

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

在这个示例中，通过设置border-width属性的四个参数来定义三角形的大小和形状。通过设置border-color属性来定义边框的颜色，其中左边和右边的颜色设置为透明，使得只有底边的颜色是可见的。通过transform属性的rotate()函数来旋转元素，使得三角形以45度的角度旋转。

通过调整border-width的参数值、border-color的颜色值，以及transform的旋转角度，可以根据需要来调整三角形的样式和形状。