一尘不染

是否可以在选择框中将文本居中?

css

HTML:

<select name="state" class="ddList">
   <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>

CSS:

select { width: 400px; text-align:center; }
select .lt { text-align:center; }

如您所见,它不起作用。是否有仅CSS方式将文本置于选择框中?


阅读 348

收藏
2020-05-16

共1个答案

一尘不染

恐怕普通的CSS不可能做到这一点,并且不可能完全兼容跨浏览器。

该插件隐藏select元素,并动态创建span元素等以显示自定义下拉列表样式。我非常有信心您将能够更改跨度等的样式以使项目居中对齐。

2020-05-16