떠다니는 새 단어 지우기

기원 :

.clearfix:이후 {
가시성: 숨김;
디스플레이: 블록;
글꼴 크기: 0;
콘텐츠: " ";
명확함: 둘 다;
높이: 0;
}
.clearfix { 디스플레이: 인라인 테이블 }
/* IE-mac에서 숨깁니다 */
* html .clearfix { 높이: 1% }
.clearfix { 디스플레이: 블록 }
/* IE-mac에서 숨기기 종료 */

설명하다 :

• *대상 요소에 대한 부동 소수점을 지우는 보이지 않는 빈 콘텐츠 블록을 생성하는 것을 목표로 대부분의 표준 호환 브라우저에 첫 번째 선언 블록을 적용합니다.
• *두 번째 항목은 IE/Mac에만 Clearfix의 인라인 테이블 표시 속성을 적용합니다.
• *악용* / IE/Mac에서 일부 규칙 숨기기:
• * height:1%는 IE6에서 haslayout을 실행하는 데 사용됩니다.
• *IE/Mac이 아닌 IE에 블록 표시 속성을 다시 적용합니다.
• *마지막 줄은 IE/Mac 해킹을 종료하는 데 사용됩니다.

이 방법의 대상이 되는 브라우저는 역사가 되었거나(특히 Mac의 IE5) 표준이 되는 과정에 있기 때문에 이 방법은 더 이상 최신이 아닙니다.

IE/Mac에 대한 지원을 중단한 후 부동 소수점을 지우는 새로운 방법:

/* 새로운 클리어픽스 */
.clearfix:이후 {
가시성: 숨김;
디스플레이: 블록;
글꼴 크기: 0;
콘텐츠: " ";
명확함: 둘 다;
높이: 0;
}
* html .clearfix { 확대/축소: 1 } /* IE6 */
*:first-child+html .clearfix { 확대/축소: 1 } /* IE7 */

설명하다 :

IE6과 IE7 모두 :after 의사 클래스를 지원하지 않으므로 부동 소수점을 지우기 위해 IE6/7의 haslayout을 트리거하려면 다음 두 클래스가 필요합니다. 다행히 IE8은 :after 의사 클래스를 지원합니다. 따라서 IE6/7에 대한 해킹만 필요합니다.