CSS id/class 차이점

id

HTML 요소의 id 속성 값을 선택하는 방법으로 id 속성 값은 하나의 문서에 한번만 사용할 수 있다

<head>
<style>
    #main_div {
        font-size: 16px;
        margin : 5px 5px;
    }
</style>
</head>

<body>
<div id="main_div">                // 한 문서에 main_div라는 이름의 아이디 한개만 설정할 수 있다
        ...
</div>
</body>

class

HTML 요소의 class 속성 값을 선택하는 방법, 하나의 태그에 여러개의 클래스 이름을 줄수 있고 하나의 이름으로 선택해 관리할 수 있다

    <head>
    <style>
        .main_div {                             // style 태그에서 .main_div 클래스명 하나로 문서의 main_div 클래스명의 태그들을 설정한다
            font-size: 16px;
            margin : 5px 5px;
        }
    </style>
    </head>
    
    <body>
    <div class="main_div">                // 2개의 main_div 클래스 명을 설정      
            ...
    </div>

    <div class="main_div">                // 같은 클래스명 main_div로 설정됨
            ...
    </div>
    </body>

id / class 차이점

id는 한 문서에 하나만 설정할 수 있고 태그에 유일한 속성값을 사용해 관리할때 사용하고
class는 여러개의 태그들을 관리할때 주로 사용한다