前端用css画一个向上的三角形
时间: 2023-10-24 13:04:26 浏览: 94
用css画三角形
可以使用 CSS 的 border 属性来实现一个向上的三角形,具体代码如下:
HTML:
```html
<div class="triangle"></div>
```
CSS:
```css
.triangle {
width: 0;
height: 0;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-bottom: 30px solid #ccc;
}
```
这段代码会生成一个宽高相等的正三角形,通过调整 border-bottom 的颜色和宽度,可以实现不同颜色、大小的三角形。如果要旋转三角形,可以使用 transform 属性,例如:
```css
.triangle {
/* 其他样式 */
transform: rotate(45deg);
}
```
这样就可以得到一个旋转了 45 度的三角形。
阅读全文