개발자 교육과정 중 CSS,HTML을 너무 무시하고 넘어가 버렸었고, 그 뒤로 DOM을 배우면서 js와 연결하는 부분에서 많은 어려움을 겪었다😂 특히, 셀렉터와 시멘틱요소를 이해하는데 오래걸렸다.
CSS - Selector
-
자주 사용하는 셀렉터 사용법
* {}-모든 셀렉터div {}- 모든 div 셀력터div, section {}- 다중선택#only {}- id 셀럭터.only {}- class 셀렉터header h1 {}- 후손 셀렉터header > h1 {}- 자식 셀렉터후손과 자식의 차이
:후손은 자식과 후손 모두 선택이고, 자식은 자식만 선택 -
셀렉터 응용 사용법
#label.center- id가 'label'인 동시에 class가 'center'인 셀렉터
article .item- article셀렉터인 동시에 class 가 'item'인 셀렉터
HTML - element
HTML에서 요소는 <div>, <h1>, <body>, <span> 등과 같은 tag를 의미한다.
그 중 semantic element가 있다.
-
semantic element
tag에 의미를 담아 콘텐츠 영역을 논리적으로 구분하기 위한 용도로 쓰입니다.
-
대표적인 semantic element
<header>, <main>, <nav>, <aside>, <footer>의미만 부여할 뿐,
<div>tag와 똑같이 작동함.
참조 링크
여기를 클릭하여 자세한 내용을 확인하세요.
개발 기록