프로그래밍/CSS 공부

CSS 선언 방식 4가지

이자다 2023. 1. 20. 14:56
반응형

1. 내장 방식

 

<style></style> 태그 내부의 내용으로 스타일을 작성하는 방식

 

 

2. 인라인 방식

 

<div style="color: red; margin: 20px;"></div>

이렇게 요소의 style속성에 직접 스타일을 작성하는 방식

 

 

3. 링크 방식

 

<link>로 외부CSS 문서를 가져와서 html 파일에 연결하는 방식.

<link rel="stylesheet" href="./css/main.css"> 처럼 작성한다.

한 html 파일에 여러 link로 연결 가능해서 병렬 방식이라고 볼 수 있다.

 

 

4. @import 방식

 

'CSS 문서 안에서' CSS의 @import 규칙으로 또 다른 CSS 문서를 가져와서 연결하는 방식이다.

링크 방식처럼 html 파일에 연결하는 방식이 아니라, html 파일에 연결된 CSS 파일에 @import를 작성해 다른 CSS 파일을 연결하는 방식이다.

 

html  <-link-  CSS1  <-@import-  CSS2

 

이러한 방식을 직렬로 연결한다고 표현한다. CSS1에서 html파일에 연결하지 않는 이상 CSS2는 html파일에 연결할 방법이 사라진다.

@import url("./box.css");  같은 형식으로 CSS파일에 작성하여 연결한다.

 

반응형

'프로그래밍 > CSS 공부' 카테고리의 다른 글

선택자_가상 클래스2  (0) 2023.01.23
CSS 선택자 해석 팁  (0) 2023.01.23
선택자_가상 클래스(의사 클래스)  (0) 2023.01.23
CSS 선택자_복합  (0) 2023.01.20
CSS 선택자_기본  (0) 2023.01.20