✍TIL (Today I Learn) / 키워드
: 오늘 배운 것
새로운 사람들을 마나고 시작한다는 것은 그만큼 내가 몰랐던 정보를 또 알 수 있는 기회라고 생각한다.
OT에서 자기소개를 하던 중 어떤 팀에서 TIL을 하겠다는 이야기가 나와서 저게 어떤걸까 궁금해서 검색을 해봤다. 이미 블로그를 하는 개발자들은 많이들 했었고 하고 있으며 GitHub에 1일1커밋과 비슷한 것 같다. 차이라면 글과 코드로 오늘 배운 내용을 복습하는 방법의 차이가 아닐까싶다.
나는 TIL을 내가 오늘 배운내용을 되새기기 위해 기록하려고 쓸 것이다.
매일 꾸준히 좋은 내용의 글을 쓸 수 있다면 베스트겠지만 사실 하다보면 말도 안되는 내용을 쓰는 날도 있겠지만
최대한 꾸준히 이어가려고한다. 나름 블로그를 두 개 운영하면서 문장이 다듬어 지지 않는게 아쉬운것도 있었고 글 연습도 하고싶었기에
글 연습과 복습의 개념으로 쓸 예정이다.
지나갔던 코드 다시 한 번 보자
1. HTML, CSS를 이용하여 이력서 양식을 만드는 강의를 듣던 중 복습한다면 내가 이걸 설명할 수 있어야 제대로 알고 있다고 할 수 있ㅈ디 않을까 싶었다. 그런데 처음부터 <!DOCTYPE html> 이 코드가 무엇이었는지에대해 말문이 막혔다.
(물론 강의에서도 그렇고 무조건 필수로! 알고 있어야하는 코드가 아니란거 알지만 몰라서 당황했다.)
2.float!
float를 쓸 때마다 항상 헷갈리던게 clear : both; 를 어디에 써야하지? 라는 부분의 고민이었다.
깨달은 점
DOCTYPE html : 웹문서가 어떤 버전의 HTML 언어로 작성되었는지 결정하는 기능
이미 과거에 사용된 버전들을 수정하는것은 현실적으로 불가능하기에 선언을 하여 이전 버전과의 호환성을 높이려고하는 이유라고한다.
2. clear: both; / overflow: hidden;
- float 속성을 적용하게되면 그 뒤에 오는 요소들에게도 영향을 끼치기때문에 clear: both;를 쓰면 float의 영향을 받지않게 한다. clear : left; 와 right도 존재하지만 일일이 지정하는 것이 번거로워 both 로 지정하는 경우가 많다고한다.
그런데 오늘 수업에서는 float가 적용된 부분을 div영역으로 묶고
그 안에 overflow : hidden; 을 사용해 float로 띄운 요소 다음에 있는 요소에 영향을 주지 않게 했다.
overflow 는 요소 안에서 모든것을 보여줄 때 지정하는데 여기서 사용한 overflow: hidden;은 묶여있는 요소 안에 것들만 보여주고 그 외의 넘치는 부분은 잘라서 보여주지 않는것처럼 된다. 그래서 다음 영역에서는 float의 영향을 받지 않는 것이다.
'TIL' 카테고리의 다른 글
| 5일차 :: CSS (0) | 2022.04.01 |
|---|---|
| 4일차 :: GET, POST 정리 (0) | 2022.03.31 |
| 3일차 :: 나도 오픈소스 기여를 할 수 있다?! (0) | 2022.03.30 |
| 2일차 :: 선택과 집중?! (0) | 2022.03.29 |
| 멋쟁이사자처럼 :: 프론트엔드스쿨2기 합격 후기 (0) | 2022.03.28 |