下拉框选中时样式 ``` option:checked { text-align: right !important; } ``` ~~~ option:not(:checked) { color: black; } /* or whatever your default style is */ ~~~ ``` select{ /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/ border: solid 1px red; /*很关键：将默认的select选择框样式清除*/ appearance:none; -moz-appearance:none; -webkit-appearance:none; direction: rlt; direction: ltr; } option:checked { /*text-align: right !important; */ font-weight: bold; text-align: center; text-align-last: center; } ``` 右对齐,展开时居中 ``` select{ text-align: right !important; text-align-last: right !important; } select option { /*direction: rtl !important;*/ text-align: center !important; } option:checked { font-weight: bold; } ```