这招对我很管用:

text-align: center;
text-align-last: center;

恐怕这在纯CSS中是不可能实现的，也不可能实现完全跨浏览器兼容。

然而，使用jQuery插件，你可以为下拉菜单设置样式:

https://www.filamentgroup.com/lab/jquery-ui-selectmenu-an-aria-accessible-plugin-for-styling-a-html-select.html

这个插件隐藏了select元素，并动态创建span元素等以显示自定义的下拉列表样式。我很有信心，你可以改变样式跨度等中心对齐的项目。

你不能自定义<select>或<option>太多。唯一的方法(跨浏览器)将是手动创建一个下拉与div和css/js创建类似的东西。

试试这个:

select {
    padding-left: 50% !important;
    width: 100%;
}

我总是用下面的方法让它只与css一起工作。

padding-left: 45%;
font-size: 50px;

填充将文本居中，可以调整文本大小:)

从验证的角度来看，这显然不是100%正确的，但它确实起作用了:)

select { text-align: center; text-align-last: center; } option { text-align: left; } <select> <option value="">(please select a state)</option> <option class="lt" value="--">none</option> <option class="lt" value="AL">Alabama</option> <option class="lt" value="AK">Alaska</option> <option class="lt" value="AZ">Arizona</option> <option class="lt" value="AR">Arkansas</option> <option class="lt" value="CA">California</option> <option class="lt" value="CO">Colorado</option> </select>