在 mac 上进行选择以看起来像选择窗口答案

【问题标题】：Make select on mac to look like select of windows在 mac 上进行选择以看起来像选择窗口
【发布时间】：2019-01-09 22:45:25
【问题描述】：

自上次更新 mac OS 系统以来，表单组件之间存在很大差异。我想要实现的是修改选择以便在 Windows 和 Mac OS 上具有相同的查看效果。问题是我想在 mac 和 windows 的 select > options 上具有相同的样式，因为在这两个操作系统上非常不同，我试图创建一个小提琴并将一些 css 应用于选择和选项，但似乎不可能改变mac上的样式。有没有人设法在 mac 上更改 select 的样式？

【问题讨论】：

stackoverflow.com/a/23040347/6178832
@SølveTornøe 没有帮助

标签： macos css select option

【解决方案1】：

您需要添加-webkit-appearance:none; 才能在选择上应用样式更改，但是，您不能更改除color 和background-color 之外的选项样式，如下所述：https://stackoverflow.com/a/17203491/6178832

如果您想在所有平台上都获得准确的样式，则必须创建自己的选择组件。 Simple how to 让您开始。

webkit-appearance 示例：

select {
  -webkit-appearance:none;
  border-radius: 0;
  padding: 5px;
  background: #fff;
}

<select id="pet-select">
    <option value="">--Please choose an option--</option>
    <option value="dog">Dog</option>
    <option value="cat">Cat</option>
    <option value="hamster">Hamster</option>
    <option value="parrot">Parrot</option>
    <option value="spider">Spider</option>
    <option value="goldfish">Goldfish</option>
</select>

【讨论】：

这很好，但我只是尝试删除选项面板的边框半径并对齐父选择下的选项。
正如我所说，据我所知，这在今天是不可能的。如果您想对选项面板进行更改，则必须放弃 select 元素并创建自己的