如何将CSS仅应用于IE 8及以下版本

Question

I want some of my styles to only be applied to IE 8 and lower. I also only want to change my style sheet and NOT my html. Is this possible?

Here is my style I want to apply to only IE 8 and lower (I don't want to change IE 9 or 10)

.ui-icon-searchfield:after {
        background-color: #000000;
        background-color: rgba(0,0,0, 0.4);
        background-image: url(images/icons-18-white.png);
        background-repeat: no-repeat;
        -webkit-border-radius: 9px;
        border-radius:  9px;
        filter: alpha(opacity=40); 

}

I only want the very last style to be used on IE 8 and lower

Answer 1

Two options:

1:

.ui-icon-searchfield:after {
    background-color: #000000\9; /* IE8 and below */  
    background-color: rgba(0,0,0, 0.4)\9; /* IE8 and below */  
    background-image: url(images/icons-18-white.png)\9; /* IE8 and below */  
    background-repeat: no-repeat\9; /* IE8 and below */  
    -webkit-border-radius: 9px\9; /* IE8 and below */  
    border-radius:  9px\9; /* IE8 and below */  
    filter: alpha(opacity=40)\9; /* IE8 and below */  
}

2:

<!--[if IE 6]>
/*According to the conditional comment this is IE 6*/
  .ui-icon-searchfield:after {your stuff}
<![endif]-->
<!--[if IE 7]>
/*According to the conditional comment this is IE 7*/
  .ui-icon-searchfield:after {your stuff}
<![endif]-->
<!--[if IE 8]>
/*According to the conditional comment this is IE 8*/
  .ui-icon-searchfield:after {your stuff}
<![endif]-->

My suggest is the second(Conditionals)

Answer 2

Check out this link. It has all the information needed to work on IE CSS.

https://css-tricks.com/how-to-create-an-ie-only-stylesheet/