使 :after 箭头变宽答案

【问题标题】：Make :after arrow wider使 :after 箭头变宽
【发布时间】：2022-01-02 17:54:08
【问题描述】：

我有css：

.custom-select::after {
    content: "˅";
  padding: 12px 8px;
  position: absolute;
  right: 20px;
  top: 8px;
  z-index: 1;
  text-align: center;
  width: 10%;
  height: 100%;
  pointer-events: none;
}

它会创建一个箭头：

arrow

我想让它更宽。我怎样才能只用 css 做到这一点？

【问题讨论】：

标签： html css styles

【解决方案1】：

只需用﹀更改 ˅。

.custom-select::after {
  content: "﹀";
  padding: 12px 8px;
  position: absolute;
  right: 20px;
  top: 8px;
  z-index: 1;
  text-align: center;
  width: 10%;
  height: 100%;
  pointer-events: none;
}

另一个答案使用css transform scale属性

transform: scale(2,1); 
/* Change the scale as needed*/

其中first参数是水平拉伸，second参数是垂直拉伸。 p>

【讨论】：

感谢您的回复。现在太宽了。也许你可以给我一个链接到你点这个箭头或输入中等大小箭头的来源？
这个怎么样：▼
这里有一些符号，包括箭头coolsymbol.com
我已经更新了答案并包含了另一种方法。
transform: scale(2,1); 是正确的答案。谢谢！