요소의 너비와 높이를 계산하는 방법을 지정하는 CSS 속성
width
나 height
값이 정해져 있을 때 border
와 padding
등이 추가되면 그만큼 width
나 height
값이 늘어나게 된다. 따라서 box-sizing
속성을 border-box
로 지정하여 border
를 포함한 크기를 width
나 height
값으로 나타낼 수 있도록 할 수 있다.box-sizing
을 기본적으로 적용한다.CSS 적용은 우선순위에 따르며, 우선순위는 점수를 계산해서 점수가 높을수록 우선순위가 높다.
점수 | 1점 | 10점 | 100점 |
---|---|---|---|
!important | 무 | 한 | 대 |
#${id} | ✅ | ||
.${class} | ✅ | ||
:#{selector} | ✅ | ||
p | ✅ | ||
* |
1점, 10점, 100점으로 나뉘어져 있으며 각각에 해당하는 점수를 합산한다.
예) p.class: 11점, p#id: 101점 등
우선순위가 같을 때에는 나중에 작성된 스타일이 적용된다!
Wecode 시작하면서 새로운 마음으로 본 HTML과 CSS. HTML이랑 CSS는 이제 조금 지겨울 정도로 공부했다고 생각했는데 그래도 다시 보니까 새삼 내가 제대로 모르고 지나간 것들이 있구나가 보인다. 복습 열심히 해야지!