Compatible CSS hack Browser

 

I. Basic Concepts

CSS hack:Write different CSS codes for different browsers.

CSS hack principle:Because different browsers have different support for CSS and parse results, they also have a relationship with the priority of CSS. We can write different CSS for different browsers based on this.

Browser priority:FF <IE7 <IE6

The writing order is generally to write the CSS of a highly recognizable browser behind it, and the CSS hack writing order is generally FF IE7 IE6.

The DIV + CSS browser is compatible with IE6, IE7, and FFDifferences:

	IE6	IE7	FF
*	√	√	×
Important	×	√	√

 

1. ie can recognize *; standard browsers (such as ff) cannot recognize *;

2. IE6 can recognize *, but cannot recognize it! Important,

3. IE7 can recognize * and can also recognize! Important;

4. Firefox cannot recognize *, but it can recognize it! Important;

 

1. Differences between IE6 and Firefox:
Background: orange; * Background: blue;
The background color of Firefox is orange, while that of IE is blue.

2. Differences between IE6 and IE7:
Background: Green! Important; Background: blue;
The background color of IE7 is green, and the background color of IE6 is blue.

3. Differences between IE7 and FF:
Background: orange; * Background: green;
The background color of Firefox is orange, while that of IE7 is green.

4. FF, IE7, and IE6:
Background: orange;
* Background: Green! Important;
* Background: blue;
The background color of Firefox is orange, that of IE7 is green, and that of IE6 is blue.

Ii. Practical suggestions

(1) Development Platform Selection

Write CSS on Firefox and be compatible with other browsers. it is certainly easier to do this than to make other browsers compatible with IE, because IE still has good support for old standards, but some of the unique features of IE are not supported by others. therefore, we recommend using Firefox with firebug extension as a platform.

(2)). CSS hack Sequence

Use Firefox as the platform, as longCodeThere won't be many places where hack is written, and almost no problem exists in browsers other than IE, so you can ignore it temporarily,

The order is as follows:Firefox> IE6> IE7> others

(3)). Hack Method

there are two methods: Processing in different files, the other is processing in the same file. in fact, the role is the same, but the starting point is different.

1. processing in the same file.
for example, : id = "bgcolor" IE6 blue , IE7 green , Firefox .

IE6 Not recognized ! Important, Or not. * + HTML. So IE6 Only yes Blue.
IE7 Recognize ! Important, Also recognize * + HTML, Priority : (* + HTML +! Important)>! Important> + html. IE7 Yes Red, blue And Green, However Green Highest priority .
Firefox And other browsers recognize ! Important .! Important Priority , Firefox Yes Red And Blue, However Red High priority . The above priority symbols are Css3 Standard , Other browsers also have other Hack Method , But I have never met Firefox Normal , Ie Other browsers are abnormal. , So there is no sharing . As long as the code specification , I believe this situation should be rare. (JavaScript Except ). 2. process different files.
Why can I process the same file and write it in multiple files for different browsers? ? This is to cheat W3C Verification tool , Actually, only two files are required. , One is for all browsers , Only IE Service . All W3C Write the code into one , And some IE Required , And cannot pass W3C Verification Code ( For example : Cursor: hand ;) Put it in another file , Use the following method to import . The front-end compatibility of web pages should not be limited to support previous browsers (Forward compatibility), but also browser services (backward compatibility ). browser development is fast, and frequent Internet users update software. High, so the significance of backward compatibility is even more important than the previous compatibility. How to backward compatibility? As long as your website meets the standards, it will never be out of date (except for the IE series, No Only available Hack, try to use a simple solution.