'내부 스타일 시트' 태그의 글 목록

[CSS] CSS 적용

- 인라인 스타일(Inline Style)

- 내부 스타일 시트(Internal Style Sheet)

- 외부 스타일 시트(External Style Sheet)

<body>
    <h1 style="color: blue; background-color: brown;">내용</h1>
</body>

- HTML 요소 내부에 Style 속성을 사용하여 CSS 스타일을 적용하는 방법이다.

<head>
    <style>
        body { color: blue; background-color:  brown;}
        h1 {color: brown; background-color: blue;}
    </style>
</head>

- <style> 태그를 사용하여 CSS 스타일을 적용한다.

/*CSS*/
h1 { color: brown; background-color: red;}

<!-- HTML -->
<head>
    <link rel="stylesheet" href="project.css">
</head>

<h1>내용</h1>

- HYML 파일과 CSS 파일을 별도로 지정한 후 필요할 때마다 파일을 가져와 사용한다.

- 외부 스타일 시트를 불러올 때는 <link> 태그를 이용한다.

- <link> 태그 : <link rel="stylesheet" href="외부 스타일 파일 경로">

① 인라인 스타일

② 내부 / 외부 스타일 시트

③ 웹 브라우저 기본 스타일

- 인라인 스타일이 적용된 태그는 내부 / 외부 스타일 시트와는 상관없이 무조건 인라인 스타일이 적용된다.

- 내부 / 외부 스타일 시트는 가장 마지막에 적용된 스타일 시트가 적용된다.

PREV 1 NEXT