2021/07 4

[CSS] 크로스 브라우징을 위한 Reset CSS, Normalize CSS

화면을 제작을 하다 보면 내가 작성하지 않았는데 margin, padding 속성이 부여돼서 이상하게 보이는 경우가 있다. '그때마다 수정해주면 되겠지'라고 생각할만한 것은 아니다. 여기서, Reset CSS, Normalize CSS가 필요하고 사용하는 가장 큰 이유는 크로스 브라우징을 위해서이다. 브라우저마다 HTML 시맨틱 태그에 대한 기본값이 다르므로 그 차이를 없애는 데 필요하다. 크로스 브라우징 👉🏻 웹 사이트를 접속했을 때 어느 한쪽에만 최적화됨을 막기 위해 공통 요소를 사용해서 제작하는 것 Reset CSS 웹 브라우저마다 각기 다른 default 스타일이 지정되어 있는데 해당 값을 초기화함으로써 다양한 웹브라우저에서도 동일한 스타일이 적용되도록 하는 설정 파일이다. W3C에서 공식적으로 ..

CSS 2021.07.30

[패스트캠퍼스] Rubber duck debugging : 첫 번째

패스트캠퍼스에서 기초 HTML&CSS 수업을 수강한 후 Github 페이지의 헤더를 똑같이 구현하는 것이 첫 과제였다. 팀을 구성해서 러버덕 디버깅으로 5F 방식을 사용해서 회고를 하려고 한다. 5F 방식이란? 👉🏻 https://codechasseur.tistory.com/102 [회고작성법] KPT, 5F 회고에 대해 알아보자 들어가기 전 스스로의 발전을 위해서는 객관적이고 다소 친절하지 못한 회고 작성이 필요하다. 매우 주관적이지만 업무(라고 하기엔 아직 경력도 없는 신입이다..😂)나 자신에게 관대하고 나태 codechasseur.tistory.com 우선, 과제 제출 후 리뷰어님께서 조언해주신 내용은 다음과 같다. 영역에 favicon 추가 로 작성한 nav를 &로 변경 요소 정렬 시 float ..

개발회고📚 2021.07.30

[CSS] 정렬, 이제는 Flex(Flexible Box)를 사용하자

CSS3 Flexible Box Flex는 요소의 크기가 불분명하거나 동적인 경우에도, 각 요소를 정렬할 수 있는 효율적인 방법을 제공합니다. 우선 Flex는 2개의 개념으로 나뉩니다. 첫 번째는 Container 두 번째는 Items 입니다. 위에서 살펴본 바와 같이 Container는 Items를 감싸는 부모 요소이며, 각 Item을 정렬하기 위해선 Container가 필수입니다. 주의할 부분은 Container와 Items에 적용하는 속성이 구분되어 있다는 것입니다. Container에는 display, flex-flow, justify-content 등의 속성을 사용할 수 있으며, Items에는 order, flex, align-self 등의 속성을 사용할 수 있습니다. Flex Container..

CSS 2021.07.27

[회고작성법] KPT, 5F 회고에 대해 알아보자

들어가기 전 스스로의 발전을 위해서는 객관적이고 다소 친절하지 못한 회고 작성이 필요하다. 매우 주관적이지만 업무(라고 하기엔 아직 경력도 없는 신입이다..😂)나 자신에게 관대하고 나태해지기 싫은 마음이 커서 이렇게 생각하는 것 같다. 그렇다고 제대로 된 회고를 작성해 본 적은 없다. 어떻게 해야 남들이 작성한 것처럼 간결하게 쓸 수 있을까?라는 보여주기 식 회고를 작성하려다 보니 작성함에 있어 망설임이 있었던 것 같다. 그러다 개발 블로그 작성 관련 특강을 듣게 되었고, 이 과정에서 KPT, 5F 두 가지의 회고 작성 방법을 알게 되어서 나중에 효율적으로 활용하기 위해 방법들을 정리해보려고 한다. 근데 회고 작성은 정말 필요한걸까? 학창 시절 때부터 자주 듣던 소리가 있다. 다음 시험에서 실수하지 않으..

ETC 2021.07.19