같은 태그들은 브라우저마다 기본 여백이 조금씩 달라서 */ /* 이걸 안 없애면 디자인할 때 예상 못한 간격이 생길 수 있다 */ /* ============================================ */ /* * 는 "모든 태그"를 가리키는 선택자(selector) */ /* 즉 페이지 안의 모든 요소에 아래 스타일을 적용한다 */ * { /* 브라우저가 기본으로 넣어주는 바깥 여백을 0으로 초기화 */ margin: 0; /* 브라우저가 기본으로 넣어주는 안쪽 여백을 0으로 초기화 */ padding: 0; /* box-sizing: border-box 는 요소의 너비/높이를 계산하는 방식을 바꾼다 */ /* 기본값(content-box)은 padding과 border가 너비에 더해져서 크기 계산이 헷갈리는데 */ /* border-box로 하면 padding, border가 이미 너비 안에 포함된 걸로 계산되어 훨씬 다루기 쉬워진다 */ box-sizing: border-box; }