Làm cách nào để xóa các đường chấm chấm trên điều khiển thả xuống SELECT/OPTION trong Firefox?

Question

Trong Chrome và các trình duyệt khác thả xuống của tôi trông tốt:

Tuy nhiên, trong Firefox nó đã không mong muốn rải rác dòng:

Tôi có đã loại bỏ thành công Firefox không mong muốn rải rác l ines cho nút và đầu vào yếu tố với các báo cáo CSS:

button::-moz-focus-inner { border: 0; } 
input::-moz-focus-inner { border: 0; } 

vì vậy tôi nghĩ những sẽ làm việc cho chọn các yếu tố/tùy chọn, nhưng họ không:

select::-moz-focus-inner { border: 0; } 
option::-moz-focus-inner { border: 0; } 

thế nào thế nào tôi có thể xóa các đường chấm trong trình đơn thả xuống này để nó xuất hiện như trong Chrome và các trình duyệt khác?

Phụ Lục

Những điều này không làm việc, hoặc:

select::-moz-focus-inner { border: 0; outline: 0 } 
option::-moz-focus-inner { border: 0; outline: 0 } 

hay này:

select { outline: 0; } 
option { outline: 0; } 

hay này:

select { outline: none; } 
option { outline: none; } 

Answer 1

hãy thử sử dụng outline: 0, wor ks cho các nút

Answer 2

Dưới đây là kết hợp hack cho rằng:

select:focus { 
    outline: 1px solid white; 
    outline-offset: -2px; 
} 
select ~ input[type=button] { 
    -moz-appearance: menulist-button; 
    margin-left: -19px; 
    width: 18px; 
    height: 18px; 
    z-index: 10; 
} 

Sau đó thêm đầu vào với tabIndex = 0 sau mỗi lần chọn Và một số mã cho tập trung "phái đoàn":

$("select ~ input[type=button]").addEvent('focus', function(){ 
    this.getPrevious().focus(); 
}); 

Answer 3

giải pháp phát hiện trên https://stackoverflow.com/a/18853002/728855 dường như hoạt động hoàn hảo.

Nói tóm lại:

select:-moz-focusring { 
    color: transparent; 
    text-shadow: 0 0 0 #000; 
} 

đâu # 000 là màu văn bản của bạn.

Answer 4

Câu trả lời của James Broad gần như hoàn hảo, nhưng văn bản "chỉ dành cho bóng" cho các mục tùy chọn trông có vẻ xấu xí. Đây là những gì hoạt động hoàn hảo cho tôi:

select:-moz-focusring { 
    color:transparent; 
    text-shadow:0 0 0 #000; /* your normal text color here */ 
} 
select:-moz-focusring * { 
    color:#000; /* your normal text color here */ 
    text-shadow:none; 
}