✍ Today I Learned
<img> 태그는 inline 속성, <div> 태그는 block 속성이다. 이미지 불러올 때 항상 유의할 것!- CSS class의 변수화 - 각 기능마다 class를 줘서 재사용성 증가!
float 속성이 적용된 HTML 요소가 자신을 감싸고 있는 컨테이너 요소보다 크면, 해당 요소의 일부가 밖으로 흘러넘치게 된다. 이때 overflow 속성값을 auto로 설정하면, 컨테이너 요소의 크기가 자동으로 내부의 요소를 감쌀 수 있을 만큼 커지게 된다.- 모든 태그에 class를 주기보다
:nth-child() 등 선택자를 잘 활용하자.
- 웹폰트는 임포트 하는 것보다 직접 다운로드하는 게 더 안전하다.
box-sizing: border-box; 로 설정하면 내가 설정한 width값이 실제 값이 된다. (참고자료)- 전체 선택자 *(asterisk)는 html 페이지 내의 모든 요소를 선택한다.
::before를 이용하면 콘텐츠 앞에 삽입, ::after를 이용하면 콘텐츠 뒤에 삽입::selection을 이용하면 텍스트를 블록 잡았을 때를 꾸며줄 수 있다.- 역시 개념만 익히는 것보다 많이 만들어 보는 게 훨씬 재밌다😋