Common css hack

Common css hack
I suddenly remembered the statistics I saw on CNZZ this morning. There were a large number of users using IE6 and 7, and my heart broke. Why are there so many people not worried about Microsoft giving up? Therefore, IE compatibility must be implemented. --Css hack is divided into three types: attribute hack, IE condition comment hack, CSS selector Hack 1, attribute hack. For this, I just want to say that there are all kinds of answers on the Internet, I only know how to copy and paste it. There are many errors. I don't know how to test it.

. MyClass {background-color: # f1ee18;/* all recognition */background-color: # 00deff \ 9;/* IE6, 7, 8, 9, 10 recognition, however, IE11 does not support this function. For example, test */background-color: # 00deff \ 0;/* IE8, 9, 10, and 11. It is said that there is also opera */background-color: # 00deff \ 9 \ 0;/* IE8, 9, 10 recognition */+ background-color: # a200ff;/* IE6, 7 recognition */* background-color: # a200ff;/* IE6, 7 recognition */_ background-color: #1e0bd1;/* IE6 recognition */}

 

Here, we should pay attention to the usage in IE6,

.myClass{background:red!important;background:green;}　　

 

Then, green is displayed. What if I write like this?

.myClass{background:green;background:red!important;}　　

 

Then you will find that the display background is red. Does IE6 know important? Of course it is wrong,

h1{ background: red!important; } h1{ background: green; }　　

 

You will find that the above style will show red under IE6. If you do not know it, it should be green. 1 2. hack

<! -- [If ie]> <! [Endif] --> <! -- Of course, lt, gt, lte, gte, And! are also used ,! -->

 

3. the selector hack refers to the selector hack, which is actually quite a lot. For attribute selectors, IE6 does not support it, but IE7 and above support it.

[Attr * = val] // multiple values [attr ^ = val] [attr $ = val] [attr ~ = Val] // there is a space between values

 

The sibling selector and IE6 are not supported, but IE7 and above support p + h1. // h1 is adjacent to p, and both have the same parent element p ~ H1 // All h1 after p will be selected