[Day 1] OT & HTML/CSS로 이력서 만들기

1. 오티

국비과정인 만큼 출석과 훈련장려금 등에 대해 설명하시면서 시작이 되었다.

설명 후에는 팀빌딩이 이루어졌고, 팀장을 자처(?)하여 발표를 맡았다!

사실 대학 때도 발표를 많이 도맡아 했던지라 근자감을 가지고 준비 안하고 다른 팀 발표를 열심히 들었는데

준비를 조금이라도 했어야 했다...!ㅋㅋㅋㅋ 갑자기 발표가 시작되자마자 떨렸드아,,,

기대만큼 발표가 맘에 들진 않았지만 ㅠ 고생했다고 격려해준 팀원들 체고,,,,!

 

 

약간 헬창(?) 느낌으로 같이 공부하면서 건강도 챙기자는 의미로 헬-발자라고 팀명을 지었다 ㅋㅋ

 

 

 

 

 

2. HTML, CSS로 간단한 이력서 만들기

 

팀활동이 끝나고 약 3 시간 동안 코드라이언에서 HTML, CSS 강의를 수강했다.

첫 날이라 기초 부분을 다뤄서 대부분의 내용을 훅훅 넘어갈 수 있었다.

그렇지만 몰랐던 내용도 있었는데..!

 

 

1) 가운데 정렬

가운데 정렬을 flex를 통해 먼저 배웠는지라 이 방법에 대해선 잘 몰랐다.

flex 없이 간단히 구현해도 될 때는 이 방식으로도 할 수 있다는 것을 알았다.

margin-left: auto;
margin-right: auto;

2) 줄 간격 조정

line-height: 16px;

3) 한 줄에 하나는 왼쪽, 다른 하나는 오른쪽 정렬

float: right /* or left */

float를 그냥 쓰는 경우에는 다른 요소들도 float의 영향을 받아 둥둥 뜨려는(?) 속성을 가지기 때문에 float 속성을 가지는 요소는 그것들끼리 div 같은 태그로 묶어줄 필요가 있다. 

그리고 묶어준 태그에다 overflow: hidden을 적용시켜준다.

overflow: hidden

 

 

 

3. 결과물

오늘 배운 float를 이용해 타이틀 옆에 내 사진을 붙여보았다 :)

내용도 나의 커리어(?)에 맞게 다시 수정해봤다.

 

 

+) 팀 깃헙 계정 생성

팀원들끼리 앞으로 꾸준히 TIL을 올리기로 했다.

꾸준히 쓸 수 있길!!

https://github.com/codelion-FEschool-2nd-TEAM6

멋쟁이사자처럼 프론트엔드 스쿨 2기 회고 6팀