7일차(2022.01.04 41분공부)

CSS Selectors (선택자)

1. Type : HTML의 태그 종류를 지정
2. Class : HTML 요소들의 클래스를 이용. 클래스 명앞에 . 붙여야함. 동일한 스타일을 여러 개의 요소에게 공통적으로 적용할 때 유용
3. ID : HTML 요소의 ID 값을 이용하여 선택. ID 명 앞에 #기호. 하나의 웹 페이지에서 하나의 ID 명은 반드시 하나의 요소에만 적용되어야 함. 여러 개의 HTML 요소들이 동일한 ID 값을 가질 수 없음.
4. Compound : 여러개의 Selector를 동시에 나열. 쉼표로 구분하여 나열된 선택자 중 하나라도 일치한다면 해당 스타일 적용됨
5. Descendent : 특정 요소의 모든 특정 하위 요소를 선택할 때 사용. 두 개의 선택자 사이에 공백을 한 칸 주게되면, 공백을 기준으로 왼쪽에 명시된 선택자의 하위에 존재하며 오른쪽에 명시된 선택자를 가진 HTML 요소를 선택하게 됨.
6. Child : 부등호 기호를 사용하여 직속 자식 요소들을 선택할 수도 있음. 직속이 아닌 손자/손녀 요소 혹은 그 하위 요소들은 제외됨.
7. Universal : *는 페이지의 모든 요소들을 선택.
8. Attribute : img[alt="cat"]은 img 태그들 중 alt 속성의 값이 "Cat"인 HTML 요소들만 선택하여 스타일 적용. alt 이외의 다른 속성들도 이용하여 선택가능.

반드시 기억해야하는 css 선택자 30개 읽다가 맘

2022.01.04 41분 공부