⌚️ 시간관리

☀️ 기상시간 - 07:00
🌕 마감시간 - 24:00
❌ 주말이라고 자꾸 쉬고만 싶고,,, 그래서 집중해서 긴시간 공부하진 못했다..

💻 오늘 배운 것

Flex 적용

개구리 옮기는 게임 하면서 배우기..!
1. justify-content : 요소들을 가로선 상에서 정렬

• flex-start: 컨테이너의 왼쪽으로 정렬
• flex-end: 컨테이너의 오른쪽으로 정렬
• center: 컨테이너의 가운데로 정렬
• space-between: 요소들 사이에 동일한 간격이 생김
• space-around: 요소들 주위에 동일한 간격이 생김

2. align-item : 요소들을 세로선 상에서 정렬 (컨테이너 안에서 어떻게 모든 요소들이 정렬하는지를 지정 )

• flex-start: 컨테이너의 꼭대기로 정렬
• flex-end: 컨테이너의 바닥으로 정렬
• center: 컨테이너의 세로선 상의 가운데로 정렬
• baseline: 컨테이너의 시작 위치에 정렬
• stretch: 컨테이너에 맞도록 늘림

3. flex-direction : 요소들이 정렬해야 할 방향을 지정

• row: 텍스트의 방향과 동일하게 정렬
• row-reverse: 텍스트의 반대 방향으로 정렬
• column: 위에서 아래로 정렬
• column-reverse: 아래에서 위로 정렬

4. order : flex 컨테이너에서 flex 아이템을, 기재된 순서를 무시하고 레이아웃에 사용하는 순서를 지정
   -> 요소는 order 속성 값의 오름차순으로 정렬,
   order 속성 값이 지정되어 있는 경우, 소스 코드의 순서대로 배치
   -> {order:순서 번호}
   초기 값은 "0"이며, 속성의 초기 값보다 작은 음수 값 "-1"을 지정하면 가장 먼저 표시됨
5. align-self : align-item의 속성을 무시하고 flex요소를 세로선상에서 정렬 (요소 정렬법은 같음)
6. flex-wrap : flex 요소들을 한줄, 또는 여러줄에 걸쳐서 정렬

• nowrap: 모든 요소들을 한 줄에 정렬
• wrap: 여러 줄에 걸쳐 정렬
• wrap-reverse: 여러 줄에 걸쳐 반대로 정렬

7. flex-flow : flex-direction, flex-wrap을 간략히 압축
8. align-content : 세로선 상에 여분의 공간이 있을 경우, flex컨테이너 사이의 간격을 조절 (여러 줄들 사이의 간격을 지정)
   -> 한 줄만 있을 경우, 효과는 적용되지 않음

• flex-start: 여러 줄들을 컨테이너의 꼭대기에 정렬
• flex-end: 여러 줄들을 컨테이너의 바닥에 정렬
• center: 여러 줄들을 세로선 상의 가운데에 정렬
• space-between: 여러 줄들 사이에 동일한 간격을 둠
• space-around: 여러 줄들 주위에 동일한 간격을 둠
• stretch: 여러 줄들을 컨테이너에 맞도록 늘림

❓오늘의 나는

1. 어제 분명 다짐했고, 오늘은 7시 전부터 눈이 떠져서 정신이 말짱했는데.. 왜그렇게 아무것도 하기 싫은건지. 내 몸 컨트롤 하는게 너무너무 어려운 요즘이다. 어떻게 해야 환기가 될지 모르겠다.
2. 머리를 식힐 겸 한 일이 너무 많았다. 4월이 되기 전에는 정신을 제발 차리고 싶다.
3. 그래도 어제 올리지 못한 블로그, 커밋을 완료 하였고, 오늘의 블로그도 꾸역꾸역 완성시켰다. 매일 조금이라도 꾸준히 하는 것에 목표를 두자!

❗️내일의 나는

1. 오전중에 일찍 일어나서 코드 분석좀 하고, 작성을 좀 해보아야겠다. 늦은 밤에는 커밋도 해보아야지
2. 내일은 정말 마지노선으로 쉬는 시간을 가져야지. 제발!