grlf grlg grid-layout-flex grid-layout-grid grid-layout-float

1
https://mins01.github.io/web_work_doc/UI/cssGridLayout/

------=----------
flex 사용시 
1. 왼쪽이 h가 2인 item이 있다면, 오른쪽에 h 가1인 item이 여러개 있어도 한줄만 차이하며, 다음줄이 넘어갈 경우, h 3에서 시작한다. (즉, 빈 줄이 생김
2. item 너비의 가변이 자유롭다.
3. 1개가 row하나를 전부 차지할 수 있다. ([data-w="only"] 부분 확인)

grid 사용시
1. dense 로 설정하면, 빈공간이 최대한 없게 위치한다.
2. item의 너비는 고정이다, 늘리거나 줄이는건 모든 item을 기준으로 해야한다.
3. 1개가 row하나를 전부 차지할 수 없다!

float 사용시
1. 흐름이 좋다. 앞에 h2가 있고 뒤에 h1이 여러개 있으면 빈칸 채워지면서 위치를 잡는다. (grid 와 같음)
2. 최대 최소 너비 적용 불가.
3. 1개가 row하나를 전부 차지할 수 있다. ([data-w="only"] 부분 확인)
-------=-------
flex와 grid 둘 다
1. 외각은 무한정 늘어날 수 있다. (gap 이 좀 남는다.)
2. item의 너비와 높이를 지정할 수 있다
3. 왼쪽 row기준 정렬이다.
댓글
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
제목 작성자 날짜
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
tag:2 #ui #appearbox
공대여자
공대여자
tag:2 #animate #css
공대여자
공대여자
공대여자
tag:2 #game #tetris
공대여자
공대여자
공대여자