Safari瀏覽器禁用選擇列表，和非殘疾人選擇列表出現在同一個

Question

我最近做了UI的應用程序，我有兩個選擇列表：

<select id="location" class="form-control" disabled>&nbsp;</select> 

<select class="form-control valid" data-val="true" data-val-required="The Reason field is required.">  <option value="2">Earth</option> 
    <option selected="selected" value="3">Mars</option> 
    <option value="4">Jupiter</option> 
    <option value="6">Saturn</option> 
</select> 

首先是disabled。它的工作原理和外觀上，除了Safari瀏覽器在iPad上的一切就好了（而且我認爲iPhone的，音樂播放器等）

在iPad上的兩個選擇列表看起來相同，即使一個被禁用。有什麼辦法讓禁用選擇列表在這些設備上顯示爲「禁用」，或者我錯過了Safari期望的一些重要屬性？我曾嘗試disabled="disabled"，disabled，以及其他一些東西也沒有用。

我有一個小提琴here。

Answer 1

只需設置不透明度爲你的目標是這樣的設備寬度：

@media (max-width:768px) { 
    select:disabled { 
     opacity: 0.5; 
    } 
}