CSS Reference

CSS 기초 문법

CSS란?

HTML이 웹페이지의 정보를 표현한다면, CSS는 HTML을 보기 좋게 디자인하는 역할을 하는 언어입니다.

CSS 주석 표시

한 줄 주석
//(슬래시 두 개)로 처리합니다.

여러 줄 주석
/* CSS 주석 */로 처리합니다.

CSS 선언 방법

내부 스타일

<head>내부에 스타일시트를 작성하는 것을 내부 스타일 이라고 합니다.
기본적으로 내부 스타일은 head 에서만 사용해야 하며, body 내부에서는 사용하지 말아야 합니다.
내부스타일은 대개 단발성 페이지의 CSS 분량이 적은 경우에 사용.

<html>
    <head>
        <style type="text/css">
            h1 {
                color: blue;
                font-size: 16px;
            }
        </style>
    </head>
    <body>
        <h1>Embed Style Sheet</h1>
    </body>
</html>

외부 스타일

가장 권장되고 일반적인 방법으로 CSS 파일을 별도로 관리하는 형태입니다.

<html>
    <head>
        <link rel="stylesheet" href="css/style.css" type="text/css">
    </head>
    <body>
        <h1>Embed Style Sheet</h1>
    </body>
</html>

인라인 스타일

한 줄(라인)으로 요소 내부에 스타일 속성을 이용하여 CSS 코드를 작성하는 것을 인라인 스타일 이라고 합니다.
속성,값이 동적으로 변경되어야 하는 경우에 사용.

<h1 style="color: blue; font-size: 16px;">
    Embed Style Sheet
</h1>