낮은 버전의 IE_Experience exchange를 사용하여 HTML5+CSS3 웹사이트를 정상적으로 실행하기 위한 3가지 솔루션

개발 시 최소한의 기준을 따른다면, 예를 들어 IE6에서 지원하지 않는 기능을 모두 사용하지 않는다면 이 글을 작성할 필요는 없지만 이런 상황은 매우 드물다고 생각합니다. 최신 브라우저에서는 더 많은 개발이 이루어집니다. 지원하는 기능을 사용하고 초기 브라우저에서 일부 다운그레이드 처리를 수행하는 것이 이 기사의 초점이기도 한 소위 "점진적 향상"입니다. 다음 방법을 통해, 하위 버전의 IE 브라우저에서도 기적적으로 웹사이트가 더 잘 실행되기를 바랍니다!
htmlshiv.js
Remy의 HTML5shiv는 JavaScript를 사용하여 HTML5 요소(예: 기본, 머리글, 바닥글 등)를 만듭니다. JavaScript로 생성된 요소는 어느 정도 스타일을 적용할 수 있습니다. 이것이 어떻게 작동하는지 생각하는 데 많은 시간을 할애할 수 있지만 누가 신경 쓰나요? 이 전략은 여전히 ​​모든 제품 웹사이트에서 필수입니다.

코드 복사 코드는 다음과 같습니다.

selectivizr. js
Selectivizr.js는 중요한 마지막 자식 항목을 포함하여 지원되지 않는 CSS 선택기와 속성을 채우기 위한 놀라운 리소스입니다. 최근 재설계에서는 selectivizr을 내장했으며 이전 IE 브라우저에 대한 세부 정보도 놓치지 않았습니다. 다음은 내 구현 코드입니다.

코드 복사 코드는 다음과 같습니다.

"en">

위 방법을 CSS에 적용하여 IE 버전별 스타일 차이를 작성했습니다. 먼저 사용자가 사용 중인 IE 버전을 확인한 다음 해당 버전의 클래스를 레이블에 추가하면 해킹이 용이해질 수 있습니다.

그런 다음 CSS 파일에 다음과 같이 작성할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

.ie6 xxx {};
.ie7 xxx {};

이 방법은 현재 편집기에서 고려하는 가장 효율적인 방법입니다. 이 방법은 JavaScript를 필요로 하지 않거나 기다리지 않습니다. 무거운 JavaScript 라이브러리가 필요하지 않습니다. 정의한 스타일 클래스는 즉시 적용되며 아직 스플래시 화면이 없습니다.

IE 브라우저가 경쟁사를 따라잡고 있지만 새 버전의 IE에도 큰 변화가 있습니다. 우리는 새 IE를 사용하여 네트워크 경험을 재구성할 수 있기를 바랍니다. 그러나 IE의 이전 버전은 여전히 ​​국내에서 상대적으로 인기가 있습니다. 좋은 소식은 이러한 리소스가 모든 최신 브라우저에서 잘 작동하고 비용도 많이 들지 않는다는 것입니다!