问题
I'm using PhoneGap build and my select tags have no dropdown arrow on the phone.
I tried applying -webkit-appearance: menulist; but this doesn't help, I tried other choices but still just shows the option with no drop down arrow.
It an issue with PhoneGap because the same code shows a dropdown arrow on the native browser on my Android phone.
Only once I use PhoneGap build does the arrow disappear. Any solutions?
回答1:
The Android Browser's rendering of <select>s is buggy and will remove the normal styling if a background or border is applied.
Since <select>s not looking like <select>s is a pretty big usability issue, your best bet is to not style them for this browser only.
Unfortunately, there's no pure CSS way of selecting/excluding the Android Browser, so I recommend you use Layout Engine (https://github.com/stowball/Layout-Engine), which will add a class of .browser-android to the <html> tag.
You could then style all <select>s except on Android Browser, like so:
html:not(.browser-android) select {
background: #0f0;
border: 1px solid #ff0;
}
来源：https://stackoverflow.com/questions/14738203/phonegap-build-webkit-appearance-no-drop-down-arrow-for-select-tag