본문 바로가기

CSS/개념

Selectors (1) - 요소,클래스,ID선택자(Type, class, id selectors)

이 포스트는 김버그님의 김버그의 HTML&CSS 강의 학습 후 메모한 내용을 정리한 것입니다.

출처 edu.goorm.io/learn/lecture/20583/%EA%B9%80%EB%B2%84%EA%B7%B8%EC%9D%98-html-css%EB%8A%94-%EC%9E%AC%EB%B0%8C%EB%8B%A4

 

김버그의 HTML&CSS는 재밌다 - 구름EDU

HTML&CSS를 한번에! 탄탄한 개념이해부터 실습까지 한 강의로 끝내기, 실무 가능한 실력으로 😎

edu.goorm.io

 

 

 

📝 메모


Selector가 많아서 부담스러워하기 보다는

Selector들을 제대로 배워놓으면 내가 원하는 요소를 마음대로 선택이 가능하다!

라는 긍정적인 마인드를 가지고 ㅋㅋ 시작

 

 

 

 

 

 

Type Selector

-HTML 태그 자체를 선택가능 h1, div, span, p strong...

 

 

Class Selector

- HTML element에 class를 준다. <div class="box"></div>

- css에서 사용할 때 클래스 이름 앞에 .(쩜)을 붙인다. 

- 한 요소가 여러개의 class를 가질 수 있다.

- 여러개의 element에 동일한 스타일을 주고 싶을 때 유용하다

 

 

ID Selector

- 주민등록번호처럼 고유한 값으로, 여러 element에 동일한 id 값을 줄 수 없다.

- CSS에서 사용할 때 앞에 #을 붙인다.