IE9에서만 CSS 그래디언트가 작동하지 않습니다

Question

어떤 이유 때문에 특정 그라디언트가 IE9에서 작동하지 않습니다 (그리고 그것이 내가 아는 한도까지입니다). 우리 웹 사이트에는 하늘처럼 보이는 배경 그라디언트가 있어야하며 메인 메뉴 탐색 메가 드롭 아래에는 파란색 그라디언트가 있어야 메인 탐색 창에서 호버와 조인 할 수 있습니다. 문제

사이트는 다음과 같습니다 http://www.streetstyles4all.co.uk

하나는 조언을 할 수 있습니까?

이상한 점은 일부 그라디언트가 실제로 잘 작동한다는 것입니다. 그래디언트 생성기를 사용하여 일부 그라디언트를 만들었지 만 나는 이것에 익숙하지 않고 상당히 깊어서 혼란스러워지고 있습니다. 사전

감사에서

감사

롭

Answer 1

background: #00b9ed; /* Old browsers */ 
background: -moz-linear-gradient(top, #00b9ed 0%, #f9fdff 100%); /* FF3.6+ */ 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00b9ed), color-stop(100%,#f9fdff)); /* Chrome,Safari4+ */ 
background: -webkit-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* Chrome10+,Safari5.1+ */ 
background: -o-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* Opera 11.10+ */ 
background: -ms-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* IE10+ */ 
background: linear-gradient(to bottom, #00b9ed 0%,#f9fdff 100%); /* W3C */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b9ed', endColorstr='#f9fdff',GradientType=0); /* IE6-9 */ 

이 코드는 모든 브라우저에서 가장 잘 작동합니다, 여기 당신이에서 문제에 직면하는 경우,하자 않으며, 크로스 브라우저 호환성이다 나도 내가 직접 보게 될 것을 안다.

Answer 2

내가보기에 이것은 잘 작동하고 있습니다. IE9가 개발자 도구의 다른 브라우저 유형으로 설정되어 있지 않은지 확인하십시오. 브라우저 모드가 IE9로 설정되고 문서 모드가 IE9 표준으로 설정되었는지 확인하십시오.

덧붙여 말하자면, li에 a : hover를 사용하고 있기 때문에 그라데이션 배경이 메뉴 항목의 마우스 오버시 표시되지 않는 이유가 있습니다. IE7 및 IE8은 지원하지 않습니다. <a> 태그 이외의 요소를 가리 키십시오. CSS 스타일을 조금만 변경하면 문제를 해결할 수 있습니다.

#general a:hover { 
    // your hover effect 
} 

... 모든 버전의 IE에서 지원됩니다. 물론 <a> 태그가 비 호버 이미지를 표시하도록 조정되어 있고 <a> 태그를 display : block으로 설정했는지 확인해야 모든 정보를 표시 할 수 있지만 시도하는 것과 비교하면 사소합니다. IE < 9를 지원하려면 : 비 앵커 태그 요소에 마우스를 올려 놓습니다.