Prindol

DESIGN, HTML5, CSS3, DOM, Jquery, JSON, Actionscript2/3, Linux, IIS

You are not logged in.

#1 2012-07-27 16:41:04

skydown
Administrator
Registered: 2011-07-25
Posts: 317

[CSS] IE6~9 Hack 정리

#element {
    color:orange;
}
#element {
    *color: white;    /* IE6 + 7, doesn't work in IE8/9 as IE7 */
}
#element {
    _color: red;     /* IE6 */
}
#element {
    color: green\0/IE8+9; /* IE8 + 9 + IE10pp4  */
}
:root #element { color:pink \0/IE9; }  /* IE9 + IE10pp4 */

Offline

#2 2012-08-10 10:51:53

skydown
Administrator
Registered: 2011-07-25
Posts: 317

Re: [CSS] IE6~9 Hack 정리

border: 2px solid #f00\9; /* IE8 and below - red border */

Offline

#3 2012-08-10 11:00:40

skydown
Administrator
Registered: 2011-07-25
Posts: 317

Re: [CSS] IE6~9 Hack 정리

http://www.gravitationalfx.com/css-hack … 7-and-ie6/

IE 6,7,8 / 9

.chk {line-height:1em; line-height:1.18em\9;}
:root .chk {line-height:1.3em \0/IE9;}

익스가 새로 업데이트 될때마다 line-height가 달라서 좁은 공간에서 조절이 필요하다.

div {
border: 2px solid #aaa; /* for all browsers */
border: 2px solid #f00\9; /* IE8 and below - red border */
*border: 2px solid #0f0; /* IE7 and below - green border */
_border: 2px solid #00f; /* IE6 and below - blue border */
}
:root div {border: 2px solid #0ff \0/IE9;}

핵 순서는 8 -> 7 -> 6 순서로 사용 해야한다.
익스9는 다른행에 작성 해주면 된다.

<!--[if lte IE 9]>
Your IE8 and below HTML code here.
Perhaps importing a specific style sheet.
<![endif]-->

Offline

#4 2012-08-10 11:10:10

skydown
Administrator
Registered: 2011-07-25
Posts: 317

Re: [CSS] IE6~9 Hack 정리

http://css-tricks.com/how-to-create-an- … tylesheet/

IE-6 ONLY

* html #div { 
    height: 300px;
}

IE-7 ONLY

*+html #div { 
    height: 300px;
}

IE-8 ONLY

#div {
  height: 300px\0/;
}

IE-7 & IE-8

#div {
  height: 300px\9;
}

NON IE-7 ONLY:

#div {
   _height: 300px;
}

Hide from IE 6 and LOWER:

#div {
   height/**/: 300px;
}
html > body #div {
      height: 300px;
}

Offline

#5 2012-12-04 09:52:53

skydown
Administrator
Registered: 2011-07-25
Posts: 317

Re: [CSS] IE6~9 Hack 정리

.class {line-height:1.46em\9; *line-height:1.43em;}
:root .class {line-height:1.7em \0/IE9;}

\9 IE8
* IE6,7
:root {} IE9

Offline

#6 2014-06-19 15:51:36

skydown
Administrator
Registered: 2011-07-25
Posts: 317

Re: [CSS] IE6~9 Hack 정리

#hack{
    color:red; /* All browsers */
    color:red !important;/* All browsers but IE6 */
    _color:red; /* Only works in IE6 */
    *color:red; /* IE6, IE7 */
    +color:red;/* Only works in IE7*/
    *+color:red; /* Only works in IE7 */
    color:red\9; /* IE6, IE7, IE8, IE9 */
    color:red\0; /* IE8, IE9 */
    color:red\9\0;/*Only works in IE9*/
    }

Offline

Board footer

Powered by FluxBB