css绘制三角形和箭头
网站中写三角形或者箭头是否还在用图片？下面记录一下用css绘制三角形的方法。
先看一下下面的代码：
<div class="box1"></div>
<br />
<div class="box2"></div>
<style>
.box1{width:0px;height:0px;border:50px solid red;}
.box2{width:0px;height:0px;border-width:50px;border-style:solid;border-color:red green blue yellow;}
</style>
效果：
在上面的效果中，我们看到了四个三角形，如何得到一个三角形呢？如果其中三个三角形透明，剩余一个三角形。css代码如下：
.box2{width:0;height:0;border-width:20px;border-style:solid;border-color:red transparent transparent transparent;}
效果：
以上就得到了一个三角形，想想其他方向的三角形如何得到呢？ 箭头呢？下面附上代码
.arrow{width:50px;height:50px;border-width:2px;border-style:solid;border-color:red red transparent transparent;transform:rotate(45deg);}
相关文章
使用 JavaScript 在 HTML5 Canvas 中绘制圆
发布时间：2024/03/19 浏览次数：71 分类：JavaScript
-
在今天的帖子中，我们将学习如何使用 JavaScript 在 HTML Canvas 中创建图形，特别是圆形。
Pandas 在 Matplotlib 柱状图上绘制多列图
发布时间：2024/02/04 浏览次数：189 分类：Python
-
在本教程中，我们将探讨如何使用 `DataFrame` 对象的 `plot()` 方法在柱状图上绘制多列。
如何在 Matplotlib 中绘制数据列表的直方图
发布时间：2024/02/04 浏览次数：178 分类：Python
-
本教程介绍了如何使用 plt.hist()方法从数据列表中绘制直方图。我们可以使用 plt.hist()方法从数据列表中绘制直方图。
Python 中的 Matplotlib.pyplot.specgram()来绘制频谱图
发布时间：2024/02/04 浏览次数：213 分类：Python
-
本教程解释了我们如何使用 matplotlib.pyplot.specgram()和 scipy.signal.spectrogram()方法在 Python 中绘制频谱图。
按键值顺序绘制 Python 字典
发布时间：2023/12/23 浏览次数：91 分类：Python
-
本教程介绍了如何在 python 中绘制一个字典。本教程介绍了如何使用 Python 的 matplotlib 库中的 pyplot 模块在 Python 中绘制一个字典。
在 Java 中画一个三角形
发布时间：2023/10/19 浏览次数：185 分类：Java
-
本教程介绍了如何在 Java 中画一个三角形。在本文中，我们将学习如何在 Java 中绘制一个三角形。我们使用 AWT(Abstract Window Component Toolkit)，这是最早的 Java 开发包，
