css3 부동 지우기
4422 단어 css3
1 <style>
2 .container{width:400px;border:3px soild red;}
3 .fl{float:left;}
4 .fr{float:right;}
5 </style>
6 <body>
7 <div class="container">
8 <div class="fl"> </div>
9 <div class="fr"> </div>
10 </div>
11 </body>부작용:
1. 배경은 부동으로 인해 표시할 수 없습니다. 부모 설정(CSS background 배경) CSS 배경색이나 CSS 배경그림을 설정할 수 없고 부모 설정은 펼칠 수 없기 때문에 CSS 배경을 표시할 수 없습니다.
2. 테두리는 펼칠 수 없습니다. 위의 그림에서 보듯이 만약에 부모 레벨에 CSS 테두리 속성(css border)이 설정되어 있으면 하위 레벨에float 속성을 사용하여 부동이 발생하고 부모 레벨이 펼칠 수 없기 때문에 테두리는 내용에 따라 펼칠 수 없습니다.
3. margin padding 설정 값이 올바르게 표시되지 않습니다. 부동으로 인해 부모 하위 단계 사이에 css padding, css margin 속성이 설정된 값이 올바르게 표현되지 않습니다.특히 위쪽과 아래쪽의padding과margin이 올바르게 표시되지 않습니다.
해결 방법:
1. 자div 끝에 를 추가한다.
2. 아버지div에 오버플로우:hidden 속성을 추가합니다.(overflow:hidden 속성은 부급을 내용에 붙이는 것과 같기 때문에 대상 내 내용(float를 사용하는div 상자 포함)에 붙이고 부동을 제거할 수 있다.권장)
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
초보자를 위한 간단한 카드 호버 애니메이션html과 css만 사용하여 만든 매우 간단한 카드 호버 애니메이션을 살펴보겠습니다. css 속성을 알고 있다면 이해할 수 있지만 완전히 초보자라면 css의 기초를 배우는 것이 좋습니다. 1단계: 마크업 즉, HTM...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
