일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
Tags
- #C++ has~a
- html code
- #다차원포인터
- html multimedia
- #android activity
- docker example
- #bubbleSort
- #성적관리프로그램
- hyperledger transaction
- 토큰경제
- html video
- #CallByAddress
- mac terminal command
- html youtube
- #1차원배열
- border-box
- html5 new tag
- #3차원배열
- html charset
- #binary
- #2차원배열
- #자바상속#자바이즈어#is~a
- html plug-in
- 하이퍼레저패브릭
- html id
- #JAVASCRIPT
- #C++ 연산자함수오버로딩
- html object
- git flow
- relative path
Archives
- Today
- Total
A sentimental robot
Flex Box property 본문
Flex box
'display : flex' defines the container flexbox.
flex-direction : row (For default)
the cross axis would be vertical / the main axis would be horizontal
flex-direction : column
the cross axis would be horizontal / the main axis would be vertical
align - items
controls the cross axis. 교차축 ,수직축 담당
also controls each flex item's property 'align-self 'all. 각 플렉스 아이템들이 차지하는 너비 안에서의 정렬
align - content
for multi line flexible boxes. no effect when items are in a single line.
플렉스 컨테이너에서 아이템들이 컨테이너 상에서 어떻게 정렬될지를 정의한다.
align-self
It aligns the whole structure according to its value.
justify-items
controls the main axis 주축, 수평축 담당
'CSS' 카테고리의 다른 글
Padding (0) | 2019.05.06 |
---|---|
Margins (0) | 2019.05.06 |
Background-image (0) | 2019.05.06 |
CSS Basic - Stylesheet적용하기 (0) | 2019.04.16 |