IE6용 몇 가지 일반적인 CSS BUG 솔루션

IE6의 일반적인 CSS BUG 처리 정보

CSS BUG: 다양한 브라우저에서 스타일이 일관되지 않게 구문 분석되거나 CSS 스타일이 브라우저에서 올바르게 표시되지 않는 문제를 CSS BUG라고 합니다.

CSS 해킹: CSS 해킹은 CSS 코드에 대한 비공식 개인 수정이나 비공식 패치이기 때문에 CSS와 호환되고 다른 브라우저에서 올바르게 표시되는 기술을 말합니다.

Hack 사용의 몇 가지 부작용: CSS 코드의 가독성이 떨어지고 코드의 부담이 늘어납니다

오늘은 IE6에 대한 몇 가지 일반적인 BUG 솔루션을 공유하고 싶습니다.

(1) 이미지 간격:

a) div의 이미지 간격(이 버그는 IE6 이하 버전에서 나타납니다.)

설명: div에 이미지를 삽입하면 이미지가 be

Hack1: 한 줄에

및 작성

Hack2: 를 블록 요소로 변환하고 추가 명령문: 디스플레이: 블록;

b) dt, li(IE6)

해킹: 명령문 추가: 디스플레이: 블록: 숨겨진; ) 기본 높이(IE6)

설명: IE6 이하에서는 일부 블록 요소에 기본 높이(18px-22px보다 낮은 높이)가 있습니다.

Hack1: 요소에 명령문 추가: 글꼴 -size:0;

Hack2: 요소에 명령문 추가:overflow:hidden;

(3) Double float(이중 여백)

설명: When When browsers IE6 이하에서는 부동 요소를 구문 분석하면 부동 가장자리 경계를 잘못 두 배로 늘립니다.

해킹: 플로팅 요소에 명령문 추가: display: inline;

(4) Percentage BUG

설명: IE6 이하에서 백분율을 구문 분석할 때 반올림을 누르세요. 계산 결과 50% 더하기 50%가 100%보다 큽니다.

해킹: 오른쪽 부동 요소에 clear:right 문을 추가합니다(오른쪽 부동 소수점 지우기)

(5) 마우스 포인터

설명: Cursor 속성의 손 속성 값은 IE8 이하 브라우저에서만 인식됩니다. 다른 브라우저에서는 이 명령문을 인식하지 못합니다. Cursor 속성의 포인터 속성 값은 IE6 이상 및 기타 커널 브라우저에서 인식됩니다.

해킹: 요소의 마우스 포인터를 손 모양으로 통합하려면 다음 명령문을 추가해야 합니다. 커서: 포인터

해킹: form 요소: float: left

(7) 버튼 요소의 기본 크기가 일관되지 않습니다.

설명: 각 브라우저의 버튼 요소 크기가 일관되지 않습니다.

Hack1: 균일한 크기 / (마크로 시뮬레이션)

Hack2: 입력 주위에 라벨을 배치하고 이 라벨에 버튼 스타일을 쓰고 테두리와 배경색을 제거합니다.

Hack3: 버튼이 그림인 경우 그림을 버튼 배경으로 직접 사용합니다.

(8) 브라우저가 버튼 테두리를 구문 분석할 때 테두리를 구문 분석합니다. 버튼 내부에 위치하며 버튼 크기에는 영향을 주지 않습니다.

(9) 브라우저가 여백 속성 값을 구문 분석할 때 상한 및 하한 경계의 속성 값이 일치하고 왼쪽 및 오른쪽 가장자리가 함께 추가됩니다. 🎜>