class와 id 속성

들어가기 전에

HTML 속성 중 class와 id란 무엇이며 어떻게 사용할까? 고유한 값인 id와 중복사용이 가능한 class의 활용 방법에 대해 알아보자.

학습 목표

1. class와 id의 목적을 이해하고, 구분해서 작성할 수 있다.

핵심 개념

- HTML 태그 안에서 사용되는 class 속성과 id 속성

id

- identifier : 고유한 값이기 때문에 하나만 써야한다. 하나 이상 써도 오류가 나지 않기 때문에 의도적으로 하나를 쓰도록 노력해야 함

- 각각 하나하나 어떤 특별한 제어를 할 수 있으며 검색에도 용이하다.

class

- 하나의 HTML 안에 중복해서 쓸 수 있다.

- 하나의 태그에 여러 개의 다른 class 이름을 공백을 기준으로 나열할 수 있다.

- 같은 class에는 동일한 CSS 스타일을 부여할 수 있다.

생각해보기

Q1. 좋은 class 이름을 짓는 규칙은 무엇일까? id를 다른 웹사이트에서는 실제로 어떻게 사용할까?

A1. 개발을 하면서 좋은 이름을 짓는 것이란 무조건 직관적으로 짓는 것.. 무엇을 나타내려고 하는지를 누구나 봐도 알 수 있도록..! 

Q2. 요즘에는 data 속성이라는 것도 자주 사용한다. tag에 추가적인 데이터 정보를 표현하기 위함이다. 이 부분도 같이 살펴보자.

A2. data 속성은 JavaScript에서 활용할 목적의 데이터를 숨겨놓기 위해 사용한다...! 'data-*' 형식으로 사용하며 jquery에서 접근하여 조회, 제어가 가능하다...! 참고 링크 : https://auswendy.blog.me/221140343424