CSS 텍스트가 이미지 주변을 감싸도록 배치하기 (float)
페이지 정보
조회 156회
작성일 24-07-13 09:14
이미지 주변으로 텍스트가 자연스럽게 흐르도록 배치하는 CSS float 예제다. 이미지에 float: left나 right를 적용하고 margin으로 여백을 조절하면, 본문 텍스트가 이미지 옆과 아래를 감싸는 신문 기사 형태의 레이아웃이 만들어진다. 동작을 확인할 수 있는 CodePen 데모를 포함한다.
See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.
- 이전글CSS width를 콘텐츠 크기에 맞게 지정하기 (fit-content) 24.07.13
- 다음글CSS로 예쁜 밑줄(언더라인) 효과 만들기 23.10.23