html下拉列表时箭头加粗

您可以使用CSS来修改下拉列表箭头的样式。以下是一些样式示例：

1. 改变箭头颜色和大小：

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position-x: 100%;
  background-position-y: 50%;
  border: none;
  font-size: 16px;
  padding: 8px;
}

在这个示例中，我们使用了一个SVG图像来绘制箭头，并将其作为背景图像应用到下拉列表中。您可以通过修改SVG的颜色、大小和路径来自定义箭头的外观。

2. 加粗箭头：

select::-ms-expand {
  display: none;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: white;
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position-x: calc(100% - 0.5em);
  background-position-y: center;
  border: 1px solid gray;
  border-radius: 4px;
  font-size: 16px;
  padding: 8px 24px 8px 8px;
}
select:focus {
  outline: none;
  box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);
}

在这个示例中，我们使用CSS伪元素::-ms-expand来隐藏IE浏览器默认的下拉箭头，并使用SVG图像作为背景图像。我们还通过设置背景位置和填充来调整箭头的位置和大小。最后，我们添加了一些边框和阴影效果来突出显示下拉列表。