[CSS/JS] 같은 class name 개별 설정방법

html에서 작성한 여러가지 tag에 동일한 값을 주고싶을때 같은 class name을 사용한다. 이 경우 내가 원하는 n번째 class name을 선택하여 개별값을 부여할 수 있다.

[css]

📌.class 뒤에 한칸 띄고 작성해야함 ex) .class :first-child{}

:first-child

형제중 가장 첫번째를 뜻하며 동일 class중 가장 상단에 있는 요소를 나타낸다.

:nth-child(num)

동일 class중 num인자 값에 해당하는 num번째 요소를 나타낸다.

:last-child

동일 class중 마지막에 해당하는 요소를 나타낸다.

[JavaScript]

getElementByClassName('string')[num]

 num은 0부터 시작하며 가장 첫번째 요소를 나타낸다.

자바스크립트는 외에도 id, tagName등을 가지고 선택할 수 있는 여러 메소드가 있지만 js시리즈에서 다룰예정이다.