ie7에서의 표시 정보: 인라인 블록 예제 튜토리얼

디스플레이에 대해 지원되지 않는 솔루션 정보: IE7의 inline-block

오늘 코딩하는 동안 이 문제가 발생했습니다.

인라인 요소인 경우 디스플레이 속성이 inline-block으로 설정되면 모든 브라우저에서 이를 지원합니다.

반대로 블록 수준 요소인 경우 display: inline-block으로 설정하면 ie6/ie7에서는 이를 지원하지 않습니다.

IE에서 인라인 요소에 대해 display:inline-block을 사용하면 이를 인식하지 못하지만, display:inline-block을 사용하면 IE에서 레이아웃이 실행되므로 인라인 요소에 display:inline-block 특성이 부여됩니다. .

이때 블록 요소는 display:inline-block으로만 레이아웃되고 그 자체가 행 레이아웃이므로 트리거 후에도 블록 요소는 여전히 행 레이아웃에 있으며 처럼 인라인으로 렌더링되지 않습니다. Opera 객체의 블록 요소.

해결책:

1. (이번에 사용한 것입니다.)

렌더링할 블록 요소를 인라인 객체로 직접 설정(display:inline 속성 설정)한 다음 블록 요소의 레이아웃(예: Zoom:1 또는 float 속성 등) 코드는 다음과 같습니다:*/*권장: IE6, 7*/DIV {
디스플레이: 인라인-블록;

*디스플레이: 인라인; }

세 가지 모두 필수입니다

/*권장*/div {

                                                     >                                     }

2. (여기에 복사)

첫 번째 사용 display:inline-block 속성을 사용하여 블록 요소를 트리거한 다음 display:inline을 정의하여 블록 요소를 인라인 객체로 렌더링합니다(두 개의 디스플레이는 차례로 배치되어야 합니다. 이는 두 개의 CSS 문에서만 적용됩니다. 이는 IE의 고전적인 버그입니다. display:inline-block이 먼저 정의된 다음 디스플레이가 다시 인라인 또는 블록으로 설정되면 레이아웃이 사라지지 않습니다. 코드는 다음과 같습니다(...다른 속성 내용은 생략됨):

div {display:inline-block;...}

div {display:inline;}

위 내용은 ie7에서의 표시 정보: 인라인 블록 예제 튜토리얼의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!