많이 사용하는 CSS 핵 정리 (IE7, IE6 위주)

매번 핵 사용할 때마다 인터넷 검색하기가 귀찮고, 실무에서는 별로 쓰이지 않는 내용들이 많다. 그래서 많이 쓰는 핵 위주로만 정리해 보았다.


IE6 에서만 적용하기 (Underscore Hack)

.qwer {margin:10px; _margin:5px}

프로퍼티 가장 앞부분에 언더바(_)만 붙여주면 된다. 이러면 IE6에서만 적용된다. 위 예제처럼 마지막 부분 프로퍼티에 언더바를 붙여 적용하면 좋다.


IE7 에서만 적용하기

.qwer {margin:10px;}
*:first-child+html .qwer {margin:5px;}

*:first-child+html 을 셀력트 앞에 붙여주면 된다. 위 예제는 qwer 클래스에서 적용된 마진 10픽셀이 IE7에서만 마진 5픽셀 만큼만 인식되게 하는 예제다.

IE8 적용하기 (IE6,7에서도 인식된다)

.qwer {margin:10px; margin:5px\9}

프로퍼티 값의 마지막에 \9를 쓰면 되는데, 문제가 하나 있다. IE6이나 7에서도 인식이 되어버린다. 이럴땐 뒤에 IE6,7 핵으로 다시 정의해 줘야 한다. IE8 관련 문제는 그리 많지 않은 편이므로 요건 쓸일이 많지 않다.



다른 브라우저들은 대체로 웹표준을 잘 준수하고 있어 핵 사용의 필요성이 별로 없지만, IE6,7은 핵 사용이 불가피한 경우가 많다. 핵 사용이 장기적으로 좋지 않지만, 당장 시간이 급한 코더들에겐 유용한 것이 아닐 수 없다!