CSS : 비활성화 된 HTML 버튼의 그림자 제거

Question

HTML 버튼을 비활성화하면 그림자가 버튼 텍스트에 추가됩니다. 저는 버튼을 직접 스타일링하고 그림자가없는 단색 (흰색) 만 갖고 싶지만 효율적으로 어떻게해야하는지 모릅니다.

내 이전 방법은 활성화 된 상태로두고 버튼의 마우스 오버 + 활성 상태를 다시 지정하고 클릭 바이 자바를 무시하는 것이 었습니다. 매우 효율적이지는 않습니다.

http://jsfiddle.net/gLfMX/

EDIT : 이미지의 그림자 (IE9에서 시청중인) + 확대 된 버전을 표시.

Answer 1

시간을 들인 후, 나는 IE로 끝낼 수 없다는 결론을 내 렸습니다.

jQuery를 사용하여 모든 버튼 클릭을 처리하므로 CSS 선택 속성이 적용된 버튼을 무시합니다. 그것이 가장 우아한 해결책은 아닐 것이지만 브라우저 간 viewbale입니다.

감사합니다. Nicole과 danferth에게 도움을 요청합니다.

Answer 2

border:none;를 추가하여 그림자를 제거하는 jsfiddle

Answer 3

이것은 또한 작동합니다

input[disabled] { 
    border: none; 
} 

http://jsfiddle.net/gLfMX/2/

이 방법은 특별히 걱정하지 않고 장애인 입력을 타겟팅 할 수 있습니다 다른 사람들과의 간섭

Answer 4

이미 자신의 답변을 올렸지 만, 여기에 약간의 정보가 있습니다.

내 실험에서 나는 같은 결론에 도달했습니다 : IE에서는 CSS에서 변경할 수 없습니다. 이유가 여기 있습니다.

비활성화 된 버튼의 색상은 Windows가 for the "3D Objects" item in "Window Color and Appearance" (표시 설정 아래)으로 표시되도록 구성되어 있는지 여부에 따라 다릅니다.

비활성화 된 버튼의 기본 색상은 text = A0A0A0, 그림자 = 흰색입니다. 사용자가 기본값을 변경하면 (Windows 7에서 '고급 설정'으로 이동해야합니다.) 거의 모든 사용자가 기본값을 변경합니다. 비활성화 된 버튼의 시스템 기본 배경색 인 F4F4F4에 맞게 설계되었습니다.

이 문제에 대한 나의 해결책은 적어도 기본 설정을 위해, IE에서 비활성화 된 버튼이 확인 보일 것입니다 수 있도록 CSS를 설계하는 것입니다 - F4F4F4에 사용할 때 가장 좋은 방법은 배경을 설정하는 것입니다 :

button[disabled], a[disabled] { 
    background-color: #f4f4f4; 
} 

당신이 나 같은 Bootstrap를 사용하는 경우, 대신이 작업을 수행해야합니다

.btn[disabled], .btn.disabled[disabled] { 
    background-color: #f4f4f4; 
} 

조건부 선택기를 추가하여 IE에서만이 기능을 활성화 할 수도 있습니다.

Answer 5

다음은 버튼 내부의 텍스트에서 음영 처리를 제거하는 방법의 예입니다. 메뉴 버튼에서 음영 처리를 제거하려고했습니다.

CSS의 최상위 메뉴 스타일링을 마친 후 일반 메뉴 스타일링을 찾았습니다. "텍스트 그림자"스타일을 처음으로 보았던 곳에서는 문제가 있습니다. 여기 광산을 발견 : 어떤 위치 적용으로

#menu a{display:block;line-height:35px;padding:0 14px;text-decoration:none;color: 
    #77778b;font-family:'Oswald', Arial, sans-serif;text-shadow:none;} 

내 텍스트 그림자 #FFFFFF로 설정했다. 나는이 스타일링과 빵을 제거하고 내 버튼에 더 이상 그림자를 남기지 않았습니다.

그냥 "텍스트 그림자"메뉴의 CSS에 먼저 적용되는 곳을 찾아 선택하고 설정을 "텍스트 그림자 : 없음"