CSS에서 블록의 float 속성
float 속성은
이미지뿐만 아니라 다른 모든 블록에도 적용할 수 있습니다.
한번 확인해 보겠습니다.
parent 클래스를 가진 부모 블록이 있고,
그 안에 텍스트와 child 클래스를 가진 자식 블록이 있다고 가정해 보겠습니다.
두 블록 모두 테두리가 지정되어 있으며, 자식 블록에는 너비와 높이도 지정되어 있습니다:
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
width: 200px;
height: 100px;
border: 1px solid green;
}
:
이제 자식 블록에 float를
left 값으로 설정해 보겠습니다. 그러면 텍스트가 블록 주위를 감싸기 시작할 것입니다:
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
float: left;
width: 200px;
height: 100px;
border: 1px solid green;
}
: