css에서 부동 문제를 신속하게 해결합니다
2402 단어 프런트엔드htmljavascriptcss
부동을 왜 제거합니까?
하위 상자에 부동이 설정되어 있으면 부모 상자의 높이가 설정되지 않고 부동의 하위 요소가 공중에 떠다니기 때문에(표준 흐름에서 벗어나기) 하위 상자는 부모 상자를 벗어나 부모 상자의 높이가 0이 됩니다.
부동을 어떻게 제거합니까?어떤 방법이 가장 좋아요?
첫 번째:
아바타 상자에 고정 높이를 설정합니다. 아바타 상자가 부동하면 표준 흐름에서 벗어나 아버지께 고정 높이를 설정하면 아바타 상자가 고정되어 죽습니다. 그런데 밑에 많은 내용이 있으면 어떻게 합니까?그래서 이 방법은 엄격하지 않고 융통성이 없다.
두 번째:
마지막 부동 서브 요소 뒤에div 라벨을 붙이고,div 설정clear:both 스타일: 이런 방법도 부동을 제거할 수 있지만, 사용하는 것을 추천하지 않습니다.
세 번째:
부모 요소에 오버플로우:hidden을 추가합니다. 이런 방법도 부동을 제거할 수 있습니다. 오버플로우:hidden;부동을 제거할 수 있을 뿐만 아니라 넘치는 숨겨진 문제도 해결할 수 있고 바깥쪽 거리의 무너진 문제도 해결할 수 있다. 그러나 이런 부동을 제거하는 방법도 좋지 않다. 부모 요소에 오버플로우:hidden을 첨가했기 때문에 부모 요소도 넘치는 숨겨진 문제를 설정했다. 그러나 이것은 우리가 보고 싶지 않은 것이다.이런 방법은 적용되지 않는다.
네 번째:
애프터 위조 요소를 사용하여 부동을 제거하고 위조 요소는 인덱스를 쓰는 것이 가장 좋습니다. 인덱스 호환성이 비교적 좋기 때문입니다(추천합니다)
.clearfix:after{/* */
content: "";
display: block;
height: 0;
clear:both;
visibility: hidden;
}
.clearfix{
*zoom: 1;/*ie6 * IE6-IE7 , */
다음은 큰 상자 안에 두 개의 하위 상자를 끼워서 부동을 제거하는 네 가지 방법을 검증하는 것이다.
Document
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Django의 질문 및 답변 웹사이트환영 친구, 이것은 우리의 새로운 블로그입니다. 이 블로그에서는 , 과 같은 Question-n-Answer 웹사이트를 만들고 있습니다. 이 웹사이트는 회원가입 및 로그인이 가능합니다. 로그인 후 사용자는 사용자의 ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.