성배 레이아웃은 사람들이 성배를 찾기 위해 노력하지만 못찾은 것처럼 완벽한 레이아웃만들기에 비유해서 만들어진 말입니다. 위와 같은 레이아웃을 비유적으로 성배 레이아웃이라 하는데 이 모양을 만들어내는데 flex를 사용하면 간편하게 달성할 수 있습니다. 생활코딩 html css javascript AD 홈페이지 ->main에 있는 lorem1000 부분은 양이 너무 많아서 주석 처리 해놨습니다. main 내부에 content를 랜덤으로된 1000글자를 주면 성배 레이아웃의 모습을 제대로 볼 수 있습니다. Properties for the flex container flex-direction row /*기본값*/ row-reverse column column-reverse flex-direction row /..
flex - 엘리먼트들의 크기나 위치를 쉽게 잡아주는 도구, 레이아웃을 효과적으로 표현 가능 부여되는 속성을 나타낸 차트▼ Container item display order flex-direction /*기본값: row 행의 방향 column 수직*/ flex-grow /*기본값 0*/ flex-wrap flex-shrink flex-flow flex-basis justify-content flex align-items align-self align-content container에 height를 지정해주어야 flex의 효과를 제대로 알 수 있습니다. item관련 flex속성 flex-basis flex의 방향에 해당되는 엘리먼트의 기본크기를 설정하는 속성, row 면 가로폭 , column이면 세로폭..
보호되어 있는 글입니다.
보호되어 있는 글입니다.
보호되어 있는 글입니다.
보호되어 있는 글입니다.
보호되어 있는 글입니다.
보호되어 있는 글입니다.
- Total
- Today
- Yesterday
- nvm 설치순서
- aspect-ratio
- 타입스크립트 장점
- reactAPI
- D 플래그
- nvm경로 오류
- 원티드 FE 프리온보딩 챌린지
- 항해99추천비추천
- grid flex
- 틸드와 캐럿
- 형제 요소 선택자
- fs모듈 넥스트
- && 셸 명령어
- 원티드 프리온보딩 프론트엔드 챌린지 3일차
- getServerSideProps
- is()
- ~ ^
- 원티드 프리온보딩 FE 챌린지
- 프리렌더링확인법
- tilde caret
- 프리온보딩 프론트엔드 챌린지 3월
- getStaticPaths
- text input pattern
- Prittier
- 타입스크립트 DT
- float 레이아웃
- 항해99프론트
- 부트캠프항해
- 원티드 3월 프론트엔드 챌린지
- 항해99프론트후기
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |