오늘 한 일
- CSS selector, display, position, flexbox에 대한 유튜브 강의 시청
- 노션에 강의 내용 정리
공부한 내용
selector
강의 들을 땐 몰랐는데 셀렉터 종류가 엄청 많다... 복합 셀렉터는 게임으로 겨우겨우 익혔다.
display
display의 값을 변경해서 블록레벨 요소를 인라인 또는 인라인-블록 요소로 바꿀 수 있다는 것을 배웠다. 인라인과 인라인-블록의 차이점도 알게 됨
position
강의를 들으면서도 absolute의 개념이 살짝 헷갈렸었는데 absolute가 static을 제외한 부모 요소를 기준으로 이동한다는 글을 보고 캡쳐된 내용처럼 보기 쉽게 배치해 봤더니 그제서야 이해가 갔다.
앞에 있는 div들을 다 무시하고 상위 클래스인 .conteiner로 냅다 이동 하는 absolute 박스를 보는데 조금 허망했다. 이렇게 쉬운걸 이해를 못했다니 바보가 아닌가... 그래도 이해했다는 거에 의의를 둔다👀
캡쳐한 내용에는 없지만 웹페이지에서 스크롤을 해도 따라 오는 녀석이 sticky 인 걸 알게 되었다. 웹을 배우기 전부터 궁금했었는데(계속 따라오는 광고창..) 오늘 이렇게 알게 될 줄이야ㅎ
flexbox
css는 플렉스박스를 배우기 전과 후로 나뉘는 것 같다. 어렵긴 한데 제일 재밌던 파트였다.
검색하다가 발견한 블로그인데 내일 꼭 정독해야겠다.
해야 할 것
배운 내용 복습하고 정리하기→ 정리한 내용 블로그에 올리기- css 플렉스박스에 대해 정리한 블로그 글 읽기
- Git에 대해 공부하기 → 언제 할거야...
- CS50 강의 시청, 내용 정리 하기 → 언제 할거야...22
- 영타 연습🐢 → 속도 200 이상으로 올리기
시간도 많은 데 마음 먹은 대로 안된다.
엥? css 기초 보다가 하루가 지나버렸어요.
css는 배우는 데 오래 걸려도 눈에 확 들어오니까 확실히 재밌다.
어제 생활코딩 강의를 볼 땐 CSS의 큰 흐름을 따라하는 것에 목적을 뒀는데 (그래서 뭐가 뭔지도 잘 몰랐음) 오늘 엘리님 강의를 들으면서 복습하니까 다행히도 어느정도 이해가 가기 시작했다.
특히 강의 마지막에 소개해준 셀렉터와 플렉스박스에 관련한 게임을 하면서 흥미도가 올라갔는데
주어진 프로퍼티를 보고 하나씩 맞춰가면서 푸는데 플렉스박스 마지막 문제는 앞 문제들에 비해 난이도가 확 올라서 시간이 좀 걸렸다. 그래도 풀었을 때 그 짜릿함이란...
