테스트 사이트 - 개발 중인 베타 버전입니다

float : ​The clear Property(clear 속성)

· 8년 전 · 1477

​The clear Property(clear 속성) 

 

이 clear속성은 부동 요소의 동작을 제어하는 ​​데 사용됩니다.

 

떠 다니는 요소 뒤에있는 요소는 그 주위로 흐를 것입니다. 이를 피하려면 clear속성을 사용하십시오 .

 

이 clear속성은 요소의 어느면에 부동 요소가 뜨도록 허용되지 않는지 지정합니다.

 

Example

div {

    clear: left;

}

 

 

 

<!DOCTYPE html>

<html>

<head>

<style>

.div1 {

    float: left;

    width: 100px;

    height: 50px;

    margin: 10px;

    border: 3px solid #73AD21;

}

 

.div2 {

    border: 1px solid red;

}

 

 

.div3 {

    float: left;

    width: 100px;

    height: 50px;

    margin: 10px;

    border: 3px solid #73AD21;

}

 

.div4 {

    border: 1px solid red;

    clear: left;

}

</style>

</head>

<body>

 

<h2>Without clear</h2>

<div class="div1">div1</div>

<div class="div2">div2 - Notice that the div2 element is after div1, in the HTML code. However, since div1 is floated to the left, this happens: the text in div2 is floated around div1, and div2 surrounds the whole thing.</div>

 

<h2>Using clear</h2>

<div class="div3">div3</div>

<div class="div4">div4 - Using clear moves div4 down below the floated div3. The value "left" clears elements floated to the left. You can also clear "right" and "both".</div>

 

</body>

</html>

 

 


 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
2982
2981
2980
2979
2978
2977
2976
2975
2974
2973
2972
2971
2970
2969
2968
2967
2966
2965
2964
2963
2962
2961
2960
2959
2958
2957
2956
2955
2954
2953