使用CSS画三角符号

** 前端7班 陆恩泽**
在预习5班课件过程中，若愚老师布置一个小作业就是通过CSS写一个三角符号，当时看了一些源代码的demo不是很懂（如下：粘贴CSS相关代码）。

代码块

 *{
  margin: 0;
  padding: 0;
}
.caret-down {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px solid;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.caret-up {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-bottom: 4px solid;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

我上网搜索了相关的技术博客戳这边，弄清了绘制的原理。在绘制三角形时务必要把元素的宽度和高度设置为0。我们通过设置边框的属性和边框颜色绘制不同方向和颜色的三角形