투명하게 - 불투명도 CSS는 IE8에서 작동하지 않습니다.




opacity (7)

CSS

나는 CSS-Tricks 에서 다음을 사용했다.

.transparent_class {
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* Good browsers */
  opacity: 0.5;
}

나침반

그러나 더 좋은 해결책은 Opacity Compass 믹스 인을 사용하는 것입니다. 필요한 것은 @include opacity(0.1); 브라우저 간 문제를 해결할 것입니다. 여기 에서 예제를 찾을 수 있습니다.

CSS를 사용하여 jQuery 슬라이드 다운 섹션의 트리거 텍스트를 나타냅니다. 즉, 트리거 텍스트 위로 마우스를 가져 가면 커서가 포인터로 변경되고 트리거 텍스트의 불투명도가 감소되어 텍스트에 클릭 동작이 있음을 나타냅니다 .

Firefox와 Chrome에서는 잘 작동하지만 IE8에서는 불투명도가 변경되지 않습니다.

나는 성공하지 않고 다양한 CSS 설정을 시도했다.

예를 들어

HTML :

<h3 class="slidedownTrigger">This is the trigger text</h3>

CSS :

.slidedownTrigger
{
    cursor: pointer;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=75);
    -khtml-opacity: 0.75;
    -moz-opacity: 0.75;
    opacity: 0.75;
}

불투명도를 변경하는 Internet Explorer를 중지하는 이유는 무엇입니까? 참고 : 나는 다양한 다른 요소에 대해 CSS 문장의 순서를 바꾸고 IE 자체를 사용하는 방법을 시도했다. 나는 또한 사용을 시도했다.

-ms-filter: "alpha(opacity=75)";

그러나 성공하지 못했습니다.

나는 IE8에서 불투명도 수정을 시도하기 위해 물건을 다 써 버렸습니다.

어떤 아이디어?



분명히 알파 투명도는 Internet Explorer 8의 블록 수준 요소에서만 작동합니다. display : block을 설정합니다.


위의 답변 중 아무 것도 나를 위해 일한 적이 없기 때문에 대신 DIV 태그에 투명한 배경 이미지를 제공 했으므로 모든 브라우저에서 완벽하게 작동했습니다.


이것을 설정할 때 (필자가 작성한 것과 똑같이) 내가 필요할 때 나를 도와 주었다.

-moz-opacity: 0.70;
opacity:.70;
filter: alpha(opacity=70);


display: inline-block; 사용 display: inline-block; 이 문제를 해결하기 위해 IE8에서 작동합니다.

FWIW, opacity: 0.75 는 모든 표준 호환 브라우저에서 작동합니다.







opacity