쓰다important IE 와 Mozilla 의 레이아웃 차이 해결

웹 디자이너 페이지 를 디자인 할 때 한 가지 문제 가 저 를 괴 롭 혔 습 니 다.메 인 메뉴 는 IE 와 다른(Mozilla,Opera 등)브 라 우 저 에 나타 난 효과 편차 2px 입 니 다.캡 처 는 다음 과 같 습 니 다.
IE 의 효과

Mozilla Firefox 의 효과

이 는 IE 가 박스 간 거 리 를 설명 하 는 bug 로 인해 발생 한 것 이다(onestab 의'유동 모형 의 문제'참조).저 는 이 문 제 를 해결 하지 못 했 습 니 다.제 가'표 대결 CSS-생사 의 싸움'을 번역 할 때 작가 의 기술 힌트 는 저 에 게 해결 방법 을 찾 아 주 었 습 니 다.사용!important。
!important 는 CSS 1 이 정의 하 는 문법 으로 지정 한 스타일 규칙 의 응용 우선권 을 향상 시 키 는 역할 을 합 니 다(참조:W3.org 의 해석).문법 형식{sRule!important},즉 정의 의 맨 뒤에 쓰 십시오.예 를 들 어 box{color:red!important;}
가장 중요 한 것 은 IE 는 이 문법 을 지원 하지 않 고 다른 브 라 우 저 는 모두 지원 합 니 다.따라서 우 리 는 이 점 을 이용 하여 IE 와 다른 브 라 우 저 에 서로 다른 스타일 정 의 를 내 릴 수 있 습 니 다.예 를 들 어 우 리 는 이러한 스타일 을 정의 할 수 있 습 니 다.

.colortest { 
border:20px  solid #60A179 !important;
border:20px  solid #00F;
padding: 30px;
width : 300px;
} 

Mozilla 에서 탐색 할 때 이해 할 수 있 습 니 다!important 우선 순위 입 니 다.따라서\#60A 179 색상 을 표시 합 니 다.

IE 에서 탐색 할 때 이해 할 수 없습니다!important 우선 순위 입 니 다.따라서\#00F 색상 을 표시 합 니 다.

볼 수 있어,이용!important,우 리 는 IE 와 비 IE 브 라 우 저 에 대해 서로 다른 스타일 을 설정 할 수 있 습 니 다.비 IE 브 라 우 저 스타일 뒤에 추가 하기 만 하면 됩 니 다!important。따라서 위 에서 언급 한 제 홈 페이지 2px 의 디 스 플레이 차이 도 쉽게 해결 할 수 있 습 니 다.
PADDING-TOP: 11px !important; PADDING-TOP: 9px;
!important 는 반드시 CSS 레이아웃 의 이기 가 될 것 입 니 다.기억 하고 파악 하 세 요:)