css - 使用 css 减少箭头粗细

Question

我想让我的箭更细。我无法更改字体重量，所以不知道该怎么做。这是我的代码。

button {
  height: 50px;
  width: 50px;
  font-size: 40px;
  border: none;
  background-color: transparent;
  outline: none;
  color: #000;
}

<button class="left-button" onclick="plusDivs(-1)">&#10094;</button>

标签： css

Answer 1

如果您想保留您拥有的图标而不使用像上面这样的字体真棒图标，请执行以下操作：

.left-button {
    font-size: 20px; (adjust as needed)
    transform: scale(.5, 1); (adjust as needed)
}

关于变换比例属性的链接：https ://www.bitdegree.org/learn/css-transform

演示：

之前： https ://jsfiddle.net/ne7mpufj/1/
之后： https ://jsfiddle.net/ekhm14r0/2/

您必须根据需要调整 font-size 和 transform scale 属性中的值，但这应该有助于它为您工作。