Select Elm에서 선택한 항목의 색상 변경 - Firefox 렌더링 문제

Question

사용자가 선택 항목에서 선택을 한 후에 선택 항목 배경에 색상을 추가하려고합니다. 결과는 파이어 폭스에서 색상이 변경되지만 선택하는 동안에 만 ... 선택이 이루어진 후 개별 선택을위한 배경은 여전히 ​​흰색입니다.

이 코드는 IE에서 정상적으로 작동하지만 지금까지 FireFox에서 저의 노력을 다 해보았습니다. 어떤 제안이라도 도움이 될 것입니다.

public static void PerformDDLBackgroundChange(SDropDownList ddl) 
    { 
     switch ((ComplianceLevel)int.Parse(ddl.SelectedValue)) 
     { 
      case ComplianceLevel.Compliant: 
       ddl.SelectedItem.Attributes.Add("class", "Compliant"); 
       break; 
      case ComplianceLevel.OtherThanSerious: 
       ddl.SelectedItem.Attributes.Add("class", "OtherThanSerious"); 
       break; 
      case ComplianceLevel.Serious: 
       ddl.SelectedItem.Attributes.Add("class", "Serious"); 
       break; 
      case ComplianceLevel.Critical: 
       ddl.SelectedItem.Attributes.Add("class", "Critical"); 
       break; 
     } 
     ddl.Update(); 
    } 

P.s 나는 상응하는 자바 스크립트 방법을 만들어 그것을 몇 가지 시도했으나 결과는 여전히 동일합니다. 항목의 배경색은 변경되지만 선택할 때가 아니라 선택할 때만 보입니다.

.Compliant { background-color : #8AC9FF; } 

.OtherThanSerious { background-color: #C2FF87; } 

.Serious { background-color: #FFBC43; } 

.Critical { background-color: #FF6743; } 

Answer 1

아, 알겠습니다.

select 요소의 스타일링에 대해 합의 된 표준이 없다고 생각합니다. 기본 OS 스타일을 엉망으로 만드는 것이 좋지 않은 것으로 일반적으로 간주됩니다.

하지만 클래스를 옵션 태그가 아닌 선택 태그에 직접 연결하면 배경색을 변경할 수 있습니다. 그러나 브라우저 전반에서 동작이 매우 불규칙합니다.