수레를 제거하는 방법은 무엇입니까?

수레를 지우는 방법에는 클리어 속성 사용, 오버플로 속성 사용, BFC 사용, 플렉스 레이아웃 사용, 그리드 레이아웃 사용, 유사 요소를 사용하여 부동을 지우는 방법이 포함됩니다. 자세한 소개: 1. 클리어 속성을 사용합니다. 이는 플로팅 요소 뒤에 요소를 추가하고 이전 플로팅 요소와 함께 플로팅되는 것을 방지하기 위해 클리어 속성을 설정하는 방법입니다. 속성 지우기 값: 왼쪽, 오른쪽, 모두 및 없음 2. 오버플로 등을 사용합니다.

이 튜토리얼의 운영 체제: Windows 10 시스템, DELL G3 컴퓨터.

CSS에서는 주로 float를 지우는 방법이 다음과 같습니다:

1. clear 속성 사용:

float를 지우는 데 가장 일반적으로 사용되는 방법입니다. 플로팅된 요소 뒤에 요소를 추가하고 해당 요소에 클리어 속성을 설정하여 이전에 플로팅된 요소와 함께 플로팅되는 것을 방지합니다. Clear 속성에는 왼쪽, 오른쪽, 둘 다 및 없음의 네 가지 값이 있습니다. left 및 right 값은 각각 왼쪽과 오른쪽의 플로트를 지우는 데 사용되며, two 값은 양쪽의 플로트를 지우는 데 사용되며, none 값은 지우기가 수행되지 않음을 의미합니다. 예:

<div style="float:left;">浮动的元素</div>  <div style="clear:both;"></div>

2. 오버플로 속성 사용:

상위 요소에 대한 오버플로 속성을 설정하면 상위 요소의 높이가 부동 하위 요소를 포함하도록 자동으로 확장되도록 할 수 있습니다. 이 방법은 종종 Clearfix 기술과 함께 사용됩니다. 예:

.clearfix::after {content: "";display: table;clear: both;}

3. BFC(Block Formatting Context) 사용:

BFC는 요소가 콘텐츠를 배치하는 방법은 물론 다른 요소와의 관계 및 상호 작용을 결정하는 렌더링 메커니즘입니다. 다음 CSS 속성을 설정하여 BFC를 켤 수 있습니다.

• overflow: auto 및 스크롤을 제외한 모든 값(예: Overflow:hidden)
• 불투명도: 0이 아닌 값.
• transform: 없음이 아닌 값.
• 변경 예정: 모든 값.
• -webkit-overflow-scrolling: 터치 이외의 모든 값.
• display: flow-root 이외의 모든 값.
• new-box: 새 상자를 생성할 때(예: Flexbox 또는 그리드 레이아웃 사용)

4. 플렉스 레이아웃 사용:

플렉스 레이아웃은 요소의 정렬, 방향 및 순서를 자동으로 처리하는 최신 CSS 레이아웃 방법입니다. Flex 레이아웃에서는 추가 작업 없이 부동 요소가 자동으로 지워집니다. 예:

.container {display: flex;}

5. 그리드 레이아웃 사용:

그리드 레이아웃은 복잡한 2차원 레이아웃을 생성할 수 있는 최신 CSS 레이아웃 방법이기도 합니다. 그리드 레이아웃에서는 추가 작업 없이 부동 요소가 자동으로 지워집니다. 예:

.container {display: grid;}

6. 의사 요소를 사용하여 부동소수점 지우기:

이는 상위 요소의 의사 요소에 대한 명확한 속성을 설정하여 부동소수점을 지우는 일반적인 방법입니다. 예:

.parent::after {content: "";display: table;clear: both;}

위 내용은 수레를 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!