본문 바로가기

tip

ie 주석

반응형

IE8 전용핵

셀렉트 앞에 html>/**/body 를 붙히며, IE 8에만 적용이 됩니다.

html>/**/body #wrap { }
IE7 전용핵

셀렉트 앞에 *:first-child+html*:first-child+html 를 붙히며, IE 7에만 적용이 됩니다.

*:first-child+html #wrap { }
IE 6 및 하위버전 핵

속성에 언더스코어 핵을 사용한다.

#wrap { _padding:3px; }
IE 7 및 하위버전 핵

속성에 스타 핵을 사용한다.

#wrap { *padding:3px; }
IE 7, IE 8 및 최신브라우저 핵

셀렉트 앞에 html>body 를 붙히며, IE 7, IE8 및 최신브라우저에서 적용이 됩니다.

html>body #wrap { }
safari 3, chrome 1이상, opera9, ff 3.5 핵

셀렉트 앞에 body:nth-of-type(1), body:first-of-type 를 붙히며, safari 3, chrome 1이상, opera9, ff 3.5에서 적용이 됩니다.

body:nth-of-type(1) #wrap { }
body:first-of-type #wrap { }
구글 핵

구글은 사파리 엔진을 사용합니다. 그래서 사파리용 핵인 body:nth-of-type(1), body:first-of-type 아래와 같이 적용하시면됩니다.

body:nth-of-type(1) #wrap { }
body:first-of-type #wrap { }
파이어 폭스 전용 핵

x:-moz-any-link 는 FireFox 에서 x:-moz-any-link, x:default 는 FireFox 3 에서만 가능

.board_list, x:-moz-any-link { } /* FireFox 2 이상 */
.board_list, x:-moz-any-link, x:default { } /* FireFox 3 */
스타 핵 (star hack)

코딩은 워지윅 방식이 아닌 Text-Editor를 이용한 하드코딩을 기준으로 한다.

*html #wrap{ padding:3px; } /* 맨앞에 *html 을 붙혀줍니다. */
언더스코어 핵 (underscore hack)

속성의 가장 앞부분에 언더스코어(_)를 붙이며 Win IEIE 4~6 등에서 스타일이 적용되고 다른브라우저에서는 적용되지 않습니다.

#wrap { _padding:3px; } /* padding 앞에 _ 를 붙혀줍니다. */
해시 핵 (hash hack)

속성의 앞에 # 를 붙이며 Win IE 4~6,4~6, Mac IE 5, Opera 7, Mozila, Firefox 등에 스타일이 적용되고 다른다른 브라우저에는 적용되지 않습니다. (CSS의 문법상 속성의 앞에 #를 두는 것은 문법적으로문법적으로 바르지 않습니다.)

#wrap { #padding:3px; } /* padding(속성) 앞에 #를 붙힙니다. */
스타 7 핵 (star 7 hack)

셀렉트 앞에 html* 를 붙이며 Win IE 5.5~6, Map IE 5,5, Safari 등에서 스타일이 적용되고 다른 브라우저에서는 적용되지 않습니다. html* 과 선택자선택자 사이에 공백을 두시면 안됩니다.

html*p { }
xmlns 핵 (xmlns hack)

속성셀렉터를 이용하여, html요소에 붙이는 xmlns속성을 스타일적용을 위하여 사용하는 방법.
Mozilla, Fire-fox, Opera 7/8, Safari 등 속성셀렉터를 서포트하는 브라우저에서는 스타일이 적용되고, 다른 브라우저에서는 적용되지 않는다

htmlxmlns h1 { } 
:root 핵 (:root hack)

셀렉터의 앞에 :root를 붙이면, Firefox, Mac IE 5, Safari 등 :root유사클래스를 지원하는 브라우저에만 스타일이 적용되고, 다른 브라우저에서는 적용되지 않는다.

:root h1 { }

반응형