CSS Box Shadow는 웹페이지 요소에 깊이와 차원을 추가하는 강력한 방법입니다. 그러나 IE7 및 IE8에서는 이러한 섀도우가 지원되지 않습니다. 원하는 효과를 얻으려면 HTML, CSS 및 JavaScript를 조합하여 사용할 수 있습니다.
CSS 솔루션
한 가지 옵션은 CSS3 PIE 라이브러리를 사용하는 것입니다. 이전 버전의 IE에서 CSS3 속성을 에뮬레이트할 수 있습니다. PIE는 inset 키워드를 제외하고 box-shadow를 지원하므로 이를 사용하여 IE7 및 IE8의 요소에 상자 그림자를 적용할 수 있습니다. 다음은 사용할 수 있는 업데이트된 CSS입니다.
.bright{ position: absolute; z-index: 1; -moz-box-shadow: 0px -3px 55px 20px #147197; box-shadow: 0px -3px 55px 20px #147197; -webkit-box-shadow: 0px -3px 55px 20px #147197; behavior: url(ie-css3.htc); }
ie-css3.htc 파일을 다운로드하여 웹 페이지에 포함해야 합니다.
JavaScript 솔루션
또 다른 옵션은 JavaScript를 사용하여 상자 그림자 효과를 만드는 것입니다. IE7 및 IE8에 상자 그림자 지원을 추가하는 JavaScript 라이브러리 BoxShadows.js를 사용할 수 있습니다. 사용 방법은 다음과 같습니다.
<div class="bright"></div>
$(".bright").boxShadow({ x: 0, y: -3, blur: 55, color: "#147197" });
IE 브라우저 호환성
IE7은 CSS3와 같은 최신 기능을 지원하지 않는다는 점에 유의하는 것이 중요합니다. 상자 그림자이므로 이 효과를 얻으려면 폴리필이나 JavaScript 솔루션을 사용해야 합니다. IE8은 일부 CSS3 기능을 지원하지만 전부는 아닙니다. 따라서 기능 감지 스크립트를 사용하여 지원되는 기능을 확인하고 그에 따라 적절한 대체 방법을 사용해야 합니다.
위 내용은 IE7 및 IE8에서 상자 그림자 효과를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!