CSS속성 (Float)

wanseung2·2020년 12월 20일
2
post-thumbnail

Float

  • 요소를 좌우 방향으로 띄웁니다.
    속성 값에는 none, left, right 등이 있습니다!
float: 방향;
img {
  float: left;
}
  • 단순 띄움 : 요소에 float 속성을 적용하면, 아래의 그림처럼
    적용된 요소 주변으로 문자(text)가 흐르게 됩니다.
  • 수평 정렬 : 위의 요소와 다른 방식으로 사용할 수도 있습니다.
    밑에 그림을 보시면, 각 요소에 float 속성을 적용하면 차례로 정렬이 되는거죠!

  • 위에서 살펴본 float 속성 외에도 float 해제에 쓰이는 속성과 클래스가
    있지만, 과거에 많이 사용했었던 속성(다루기 불편하다)이기 때문에
    자세한 내용은 여기를 참고해주세요!!

아참!! float속성이 추가된 요소는 위에서 설명드렸던 display 속성의 값이
block 으로 수정되는 점! 알고계셔야됩니다!! 모르면 구글링 go google~~

profile
"나는 내 노력을 드러내려고 하지 않았고, 그저 내 그림들이 봄날의 밝은 즐거움을 담고 있었으면 했다. 내가 얼마나 노력했는지 아무도 모르게 말이다." - 앙리 마티스

1개의 댓글

comment-user-thumbnail
2020년 12월 22일

페이스 메이커 가 있어서 든든합니다 승완님!

답글 달기