/ CSS

CSS의 의미와 적용방법

CSS는 다음과 같이 구성되어 있습니다.

1. CSS란?

CSS는 Cascading Style Sheets 라는 의미로, html에 스타일을 지정할 때 사용하는 언어입니다. CSS를 사용하는 방법은 내부 스타일시트, 외부 스타일시트, 인라인 스타일시트가 있습니다.

2. 내부 스타일시트

내부 스타일시트는 말 그대로 html문서 내부에 css를 직접 작성하는 방법입니다. 아래처럼 head태그안에 style태그를 입력하고 그 안에 css 스타일링을 해주면 됩니다. 간편하게 사용할 수 있는 장점이 있습니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        p {
            color: tomato;
        }
    </style>
</head>
<body>
    <p>안녕하세요!</p>
</body>
</html>

3. 외부 스타일시트

확장자가 .css로 끝나는 별도의 파일을 만들어 연결하는 방법입니다.

p {
    color: tomato;
}

위처럼 따로 css파일을 만들고,

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <p>안녕하세요!</p>
</body>
</html>

link 태그의 href속성에 css파일의 경로를 적어주면 끝!

4. 인라인 스타일시트

<body>
    <p style="color: tomato;">안녕하세요!</p>
</body>

인라인 스타일시트는 html태그의 속성에 바로 스타일을 작성하는 방법입니다.

End.