페이지를 그리다보면 해당 요소를 어느 한 곳에 배치를 시켜야하는, layout을 작업해야하는 일이 많이 생긴다.
float속성의 정의는 해당 html 요소가 다른 주변의 다른 요소들과 자연스럽게 어우러지게 하는 속성인데,
layout 설정하는데에 많이 사용되고 있다.
layout설정하는데에 flex도 있고 grid 도 있고, 점점 발전된 기술이 나오고 있고,
개발하는 입장에서 더 편리하고 깔끔한 디자인을 지원해준다고 생각하지만
모든 브라우저가 flex와 grid를 지원하는 것은 아니라서 아직 float 속성이 많이 쓰이고 있다고 한다.
그래서 차이점이 어떤 것인지 감이 오지 않아서 검색을 한 결과 도움되는 페이지들을 같이 첨부한다.
나의 포스팅 : https://imswengineer.tistory.com/106
[CSS] div 가로 정렬 하기 -float
태그는 인라인 요소이기 때문에 줄바꿈 되지 않고 가로로 나열된다. 태그는 블록요소이기 때문에 자동으로 한줄을 차지한다. 그러나 태그는 안에 문자만 들어가게 작성하는 것이 좋다. 그래서
imswengineer.tistory.com
참고 : http://www.tcpschool.com/css/css_position_float
코딩교육 티씨피스쿨
4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등
tcpschool.com
참고: https://jobcoding.tistory.com/95?category=1011893
(CSS) 레이아웃 종류(Float, Flexbox, Grid)
※ 해당 글은 https://medium.com/actualize-network/modern-css-explained-for-dinosaurs-5226febe3525을 참고하여 작성되었습니다. 레이아웃은 웹페이지에서 문자, 그림, 사진을 구성하고 배열하는 일을 말한다...
jobcoding.tistory.com
'Front > CSS' 카테고리의 다른 글
[CSS] div겹치기 (0) | 2022.06.20 |
---|---|
[css][bootstrap] 버튼그룹 (0) | 2022.06.18 |
[css] 다양한 버튼 디자인 참고 (0) | 2022.05.29 |
[css] 투명색 코드 (0) | 2022.05.17 |
[CSS] div 가로 정렬하기 - flex (0) | 2022.04.30 |