클리어 플로팅을 달성하는 Css 클리어픽스 방법: 먼저 플로팅을 클리어해야 할 경우 [.clearfix]를 작성한 다음 클리어해야 하는 요소에 클리어픽스 클래스 이름을 추가하기만 하면 됩니다.
이 튜토리얼의 운영 환경: windows7 시스템, CSS3 버전, DELL G3 컴퓨터.
클리어 플로팅을 달성하기 위한 Css 클리어픽스 방법:
클리어픽스 정의:
.clearfix:after {}{ content: "."; /**//*内容为“.”就是一个英文的句号而已。也可以不写。*/ display: block; /**//*加入的这个元素转换为块级元素。*/ clear: both; /**//*清除左右两边浮动。*/ visibility: hidden; /**//*可见度设为隐藏。注意它和display:none;是有区别的。visibility:hidden;仍然占据空间,只是看不到而已;*/ line-height: 0; /**//*行高为0;*/ height: 0; /**//*高度为0;*/ font-size:0; /**//*字体大小为0;*/ } .clearfix {}{ *zoom:1;} /**//*这是针对于IE6的,因为IE6不支持:after伪类,这个神奇的zoom:1让IE6的元素可以清除浮动来包裹内部元素。*/
클리어픽스 원리:
1 IE6에서 7 줌: 1은 hasLayout을 트리거하여 내부 플로트 요소를 닫습니다. .
2. 표준 브라우저에서 .clearfix:after 가상 클래스는 .clearfix에 적용된 요소 뒤에 클리어: 두 블록 수준 요소를 삽입하여 부동 소수점을 지웁니다.
3. 부동소수점을 삭제해야 하는 경우 .clearfix를 작성한 다음 삭제해야 하는 요소에 Clearfix 클래스 이름을 추가하면 됩니다.
관련 튜토리얼 권장 사항: CSS 비디오 튜토리얼
위 내용은 클리어 플로팅을 달성하기 위해 CSS에서 Clearfix를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!