다른 브라우저에 대 한 서로 다른 CSS 코드를 작성

첫 번째 빌드를 역 무엇 CSS 해킹 인지:

CSS는 다른 브라우저, 인터넷 익스플로러 6으로 해킹, 인터넷 익스플로러 7, 모질라 파이어 폭스와, CSS의 해석 되지 않습니다 같은, 그래서 귀 착될 것 이다 페이지 효과 동일 하지 않습니다, 우리가 필요한 페이지 효과 얻을 수 없습니다. 이 시간 우리가 다른 브라우저를 작성 해야 다른 CSS, 다른 브라우저와 호환 될 수 있도록 다른 브라우저에서 또한 얻을 수 있습니다 우리가 원하는 페이지 효과. 다른 브라우저에 대 한 서로 다른 CSS 코드를 작성 하는 과정은 CSS 해킹 이라고!

다른 브라우저의 차이 살펴 봅시다:

I e 6 브라우저, 더 많은 사용자의 이전 버전
I e 7 새로운 브라우저, 표준 브라우저에 가까이
I e 8는 하지만 다른 브라우저에서 Microsoft 표준 브라우저
파이어 폭스 (모질라, 파이어 폭스)와 구글 브라우저 (크롬)는 상대적으로 표준 IE 브라우저, 우리가 일반적으로 사용 하 여이 브라우저 참조 플랫폼으로 i e 8과 두 가지 브라우저 파이어 폭스를 통해 구글 브라우저 호환성을 테스트로 일반적으로 CSS의 근접을 설명 하면서 개발에 대 한 그것은 일반적으로 i e 8을 확인 수 있습니다.

그래서 일반적으로 우리는 이러한 구별 브라우저는 CSS 해킹 방법 간단 하 고, 우리만이 3 브라우저 Ie6ie7 파이어 폭스 (Firefox)를 고려해 야 되는 모든 브라우저와 호환 될 수 있습니다.
특정 차이점은 다음과 같습니다.
차이 FF와 i e 6:
배경: 오렌지; * 배경: 블루;
I e 6와 i e 7을 구별:
배경: 그린! 중요 하다; 배경: 블루;
차이 FF와 i e 7:
배경: 오렌지; * 배경: 녹색;
Ff, ie7, i e 6 차이:
배경: 오렌지; * 배경: 그린! 중요 하다; * 배경: 블루;

참고: IE 인식할 수 *; 표준 브라우저 (예: FF) 인식할 수 없는 *;
6으로 인식할 수 *, 인식할 수 없는 하지만! 중요 한,
I e 7를 식별할 수는 *, 또한 확인할 수 있습니다! 중요 하다;
Ff로 인식 하지 않습니다 *, 인식할 수 있다 하지만! 중요 하다; 다음은 CSS 해킹 각 브라우저에 대 한 테이블

다른 추가, 더하여, "_" 밑줄
I e 6 지원 밑줄, i e 7와 Firefox 밑줄을 지원 하지 않습니다.

그래서 우리가 6으로, i e 7, firefox:background:orange;을 구별할 수 있다 * 배경: 녹색; _background:blue;

참고: 어떤 방법에 상관 없이 쓰기의 순서 앞, 중간, 마지막에 작성 된 i e 6에서에서 작성 된 i e 7에서에서 작성 된 파이어 폭스입니다.

위의 다른 브라우저는 CSS 해킹을 소개, 우리 아래 간략히 소개 이러한 CSS 해킹 사용 하는:

요구 사항 설명: 만약 우리가 클래스 Exple 이라는 CSS 속성 설정, CSS 스타일 테두리 1PX 검정 테두리, 높이 100PX 이며 IE6 브라우저 너비에서 요청 150PX 100px; i e 7 브라우저 너비, 파이어 폭스 IE8 구글 브라우저 너비는 200PX; (px는 픽셀 당 길이)

CSS 코드는 다음과 같습니다.
. exple {국경: 1px 고체 #000 높이: 100px; 너비: 200px; * 폭: 150px! 중요 하다; * width100px;
그럼 HTML 설정 div 클래스 (클래스 = "Exple"), 그래서이 부분, IE8, 파이어 폭스 구글 브라우저의 1px 검정 테두리 상자 200px 높이 100px의 너비를 표시 합니다 I e 7 브라우저 폭 1px 검정 테두리 상자 150PX 높이 100px, i e 6에서 브라우저는에의 길이 그리고 폭 100px 1px 검정 사각형으로 표시 됩니다.

브라우저 우선 순위: Ff < ie7 < 6으로 css 해킹 순서는 일반적으로 FF i e 7을 i e 6을 쓰고

: "#demo {폭: 100px;}" 예를 들어;

#demo {폭: 100px} / * 파이어 폭스, 6으로, i e 7 실행입니다. * *

* HTML #demo {폭: 120px} / * 실행 될 것입니다 6으로에 의해 이전 정의 덮어쓰게 됩니다 후, 그래서 i e 6에서 #demo 폭 120px; */

* + html #demo {폭: 130px} / * i e 7에 의해 실행 될 것입니다 * *

---------------

그래서 마지막으로, #demo的宽度在三个浏览器的解释为:

firefox:100px;

ie6:120px;

ie7:130px;

IE8 최신 CSS 해킹:

"9" 예: "국경: 1px 9;". 여기 "9" 수 있습니다 구별 모든 IE와 파이어 폭스.

"*" 6으로, i e 7은 확인 될 수 있다. IE8, 파이어 폭스 수 없습니다.

"_" 6으로 "_"를 식별할 수 있습니다, 그리고 IE7, IE8, 파이어 폭스 수 없습니다.