css hack principle_html/css_WEB-ITnose

I recently read a few articles about css hack and thought it would be a good idea to sort them out.

Many people don’t understand the principle of css hack. In fact, everyone knows that different browsers have different parsing levels of CSS, which will lead to different effects on the generated pages; especially for snakes like IE. For different browsers, at this time we need to write different CSS for different browsers (especially IE). This process is called css hack. Instead of that hack, it can be said that css hack is a kind of It is a "curve to save the country" strategy to achieve compatibility due to different rules and standards between different browsers. Even so, we still hope that the world will be unified and there will be a unified standard that can unify browser specifications T T

css The hack is mainly based on

1. Browser support and parsing results for CSS are different;

2. Priority relationship in CSS.

There are three commonly used CSS hacks, CSS internal hacks, selector hacks, and HTML header references, of which the first is the most commonly used.

A.css internal hack:

CSS internal hack syntax is like thisselector{?property:value?;} For example, IE6 can recognize the underscore "_" and the asterisk "*", IE7 can recognize the asterisk "*" but not the underscore "_", and Firefox cannot recognize both. Regarding the writing order, the CSS of browsers with strong recognition capabilities is generally written at the end.

<style> div{      background:green;/*forfirefox*/      *background:red;/*forIE6 IE7*/  }  </style> 

In this way, you have successfully hacked IE6 and 7;

For another example, only IE6 cannot recognize the way "!important" is written, other versions Can be recognized by IE and modern browsers

Other versions of IE and modern browsers can be recognized, as well as " ", "