CSS에 대한 브라우저 지원은 CSS 개발에 비해 뒤떨어져 있습니다. 절대적인 시장 점유율을 갖고 있는 Internet Explorer는 얼마 전 8번째 버전이 출시될 때까지 CSS 2.1에 대한 완전한 지원을 완료했습니다. CSS의 최신 진전은 CSS 3의 개발입니다. 사양은 이미 절반 이상 완료되었습니다. 그러나 이것이 우리가 CSS의 새로운 기술을 사용하는 것을 방해하지는 않습니다. CSS의 일반적인 기술을 사용하는 것을 좋아하기 때문에 적용할 수는 없지만 특정 브라우저에서 더 생생한 효과를 얻을 수 있습니다. 이러한 새로운 기술을 적절한 곳에 사용하면 CSS 기술의 선두에 설 수 있을 뿐만 아니라 작업이 신선해지는 느낌도 받을 수 있습니다.
새로운 CSS 기술: 모든 브라우저에서 지원될 것으로 기대하지 않음
Microsoft는 Internet Explorer 5.5~8.0의 다양한 브라우저 버전에서 CSS 지원을 발표했습니다. 이 목록에서 CSS 2.1에 대한 완전한 지원은 Internet Explorer 8.0까지 완료되지 않았으며 Internet Explorer 7.0에서만 사용할 수 있음을 알 수 있습니다. CSS 2.1의 속성 선택자(이 CSS 기술은 매우 유용하지만) 이는 여전히 시장의 40% 이상을 차지하고 있는 Internet Explorer 6.x 사용자를 고려하여 이 기술의 사용을 포기해야 한다는 것을 의미합니다. 예를 들어:
[값] { 높이:25px}
[href=http://www.dudo.org/] {color:red;}
1행에서는 값 속성이 있는 모든 양식의 높이를 25px로 설정할 수 있습니다. 특정 웹사이트에 대한 링크가 빨간색 텍스트로 표시되도록 할 수 있습니다. 그러나 Internet Explorer 6에서는 이 "새로운 CSS 기술"이 지원되지 않기 때문에 전혀 효과가 없습니다.
CSS 3에서는 속성 선택기가 더 강력한 기능을 가지고 있습니다. 또한 CSS 3에서는 둥근 모서리, 텍스트 그림자, 3차원 테두리와 같은 효과도 추가합니다. 이러한 새로운 CSS 기술은 CSS의 원래 복잡한 문제를 해결했다고 할 수 있습니다. 2 더 쉽습니다. 예를 들어 CSS 3에서는 둥근 모양을 얻으려면 다음 코드만 필요합니다.
<div style="radiu:5px">이것은 둥근 모서리입니다</div>
그러나 이 신기술은 Internet Explorer 8에서도 지원되지 않습니다. 현재 Firefox, Safari, Chrome에서만 지원되며 이 지원은 지원되지 않습니다. Firefox에서는 -moz-radius를 사용하고 Safari 및 Chrome에서는 -wekit-radius를 사용하세요.
이는 모든 브라우저에서 동시에 완전히 해석될 수 없는 CSS의 새로운 기술입니다.
새로운 CSS 기술은 CSS Hack이 아닙니다.
CSS 해킹이란 무엇입니까? CSS Hack은 브라우저에서 CSS를 사용할 때 특정 결함을 사용하여 다양한 CSS 규칙을 구현하는 방법입니다. 예를 들어 _property는 IE7, 8 및 기타 IE 버전을 구별하는 데 사용될 수 있으며, *property는 IE와 비 IE 브라우저 등을 구별하는 데 사용될 수 있습니다. 그러나 여기서 지적되는 것은 이러한 CSS Hack은 모두 비표준 CSS 사양이며 W3C 검증을 통과할 수 없다는 것입니다. 즉, 모두 잘못된 CSS 규칙입니다. 그러나 새로운 CSS 기술은 표준 CSS 사양이지만 일부 브라우저에서는 지원되지 않습니다.
게다가 새로운 CSS 기술은 해킹으로 해결할 수 없습니다. 다른 브라우저에서 상자 모델 해석이 일치하지 않는 경우 CSS Hack을 통해 수정할 수 있습니다. 그러나 둥근 사각형을 지원하지 않는 Internet Explorer의 문제는 CSS Hack 기술을 추가로 사용하는 것만으로는 해결할 수 없습니다. 배경 이미지.
따라서 새로운 CSS 기술은 일종의 CSS Hack이 아니라 정통 CSS 사양입니다.
새로운 CSS 기술의 적절한 사용
앞서 새로운 CSS 기술이 모든 브라우저에서 지원될 수는 없으며 CSS Hack 기술을 사용하는 것처럼 다른 브라우저에서 동일한 효과를 얻을 수도 없다고 앞서 언급했지만. 그러나 이것이 우리가 그것들을 사용하는 것을 방해하지는 않습니다. 상상해 보십시오. 일반 페이지를 사용에 영향을 주지 않고 브라우저에서 더욱 쉽게 사용할 수 있도록 추가할 수 있다면 더욱 매력적이지 않을까요? 그리고 우리는 CSS Hack과 같은 불규칙한 CSS 규칙을 추가하지 않고도 이 효과를 달성했습니다. 따라서 적절한 시기에 CSS 기술을 적절하게 사용하면 케이크 효과를 얻을 수 있고 웹 페이지를 더 쉽게 사용할 수 있습니다.