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으로 설정해야 한다.우리는 테두리의 속성과 테두리 색을 설정해서 서로 다른 방향과 색의 삼각형을 그립니다