css箭头朝右的三角形

要创建一个CSS箭头朝右的三角形，你可以使用以下代码：

.right-arrow {
  display: inline-block;
  position: relative;
  width: 36px;
  height: 36px;
  margin-right: 20px;
}

.right-arrow::after {
  display: inline-block;
  content: " ";
  height: 18px;
  width: 18px;
  border-width: 4px 4px 0 0;
  border-color: #c7c7cc;
  border-style: solid;
  transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  position: absolute;
  top: 50%;
  right: 6px;
  margin-top: -9px;
}

这段代码将创建一个带有箭头的容器，并使用`::after`伪元素来绘制三角形箭头。箭头的样式由`border`属性控制，通过设置边框宽度和颜色来定义箭头的形状和颜色。`transform`属性用于旋转箭头，使其朝右显示。最后，使用`position`属性将箭头定位在容器的右侧。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [CSS — 上下左右空心箭头，三角形](https://blog.csdn.net/Hjboke/article/details/99407536)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]