CSS 문법 Syntax

selector는 html 요소를 가리킨다. declaration block은 세미콜론으로 구분된 하나 이상의 선언을 포함한다.

각 선언은 콜론으로 구분된 CSS 속성 이름과 값을 포함한다.

선언은 항상 세미콜론으로 끝나고 선언 블록은 중괄호로 둘러싸인다.

p태그에 있는 글자는 빨간색이고 가운데 정렬된다.

p {
    color: red;
    text-align: center;
}

id selector

아이디는 페이지에서 유일해야한다. 유일한 요소를 선택하고 싶은 경우 id 선택자를 쓴다. #을 써서 특정 id를 선택할 수 있다.

#para1 {
    text-align: center;
    color: red;
}

class selector

특정 클래스 속성으로 요소들을 선택할 수 있다. 특정 클래스를 선택하려면 . 을 사용한다.

.center {
    text-align: center;
    color: red;
}

클래스에 의해 영향을 받아야만 하는 요소를 특정할 수도 있다.

p.center {
    text-align: center;
    color: red;
}

요소는 하나 이상의 클래스를 가리킬 수 있다.

<p class="center large">This paragraph refers to two classes.</p>

여러 요소에 같은 스타일을 정의하려면 그룹핑을 하면 된다.

h1, h2, p {
    text-align: center;
    color: red;
}

주석

코드를 설명하기 위해 사용된다. 주석은 브라우저에 의해 무시된다. /*로 시작해서 */로 끝나야 한다.

p {
    color: red;
    /* This is a single-line comment */
    text-align: center;
}

/* This is
a multi-line
comment */

https://www.w3schools.com/css/css_syntax.asp