Windows 8 Metro에서 라디오 버튼의 선택 상태를 스타일링 할 수 있습니까?

Question

나는 성공적으로

input[type=radio]::-ms-check { 
    border: none; 
    background: transparent url('myImage.png'); 
} 

와 지하철에서 라디오 버튼의 표준 모양과

input[type=radio]::-ms-check:active { 
    border: none; 
    background: transparent url('myActiveImage.png'); 
} 

와 활성 상태를 스타일했습니다 그러나 나는 내 인생의 스타일을하는 방법을 알아낼 수 없습니다 체크 된 상태. 확실한 선택은 작동하지 않습니다.

input[type=radio]::-ms-check:checked {} 
input[type=radio]:checked {} 

Metro에서도 이와 같은 작업이 가능합니까?

업데이트 :

input[type=radio]:checked::-ms-check { 
    background: red; 
} 

... 배경색을 변경하기 위해 노력하고 있지만 라디오 점을 제거하지 않습니다. 배경에서 내 이미지를 사용하려면이 작업을 수행해야합니다. 점을 제거 할 수 있습니까?

Answer 1

문제는 ::-ms-check에 올바른 콜론 크기를 사용하고 있지 않다는 것입니다. 의사 요소이므로 두 개의 콜론이 있습니다. (하나를 가진 의사 선택자와 반대 됨)

또한 순서가 뒤떨어져 있습니다. 의사 요소를 가져 와서 :checked 버전의 스타일을 지정하는 대신 :checked 라디오 버튼을 사용하여 ::-ms-check 의사 요소로 작업하도록 지정해야합니다.

따라서, 다음과 같은 작업을해야합니다 : (IE10에서 볼 경우)

input[type=radio]::-ms-check { 
    background: orange; 
} 

input[type=radio]:checked::-ms-check { 
    background: blue; 
    color: red; // to remove it, `color: transparent` 
} 

라이브 데모 : http://codepen.io/anon/pen/zAwyp