html 에 css 추가하기

CSS는 Cascading Style Sheets의 약자로

웹페이지의 레이아웃, 폰트, 색상 등을 지정하는 데 사용됩니다.

 

HTML에 CSS를 적용하는 방법은 3가지가 있습니다.

 

1. inline
2. internal
3. external

 

1. inlne

HTML 태그 안에 직접 CSS 속성을 적용하는 방법입니다.

이 방법은 style이라는 속성을 사용합니다.

 

See the Pen Untitled by HelloHailie (@hellohailie) on CodePen.

 

 

2. inaternal

HTML 파일안에 <style> 이라는 태그를 이용하여

그 안에 CSS 속성을 지정하는 방법입니다.

이 방법을 사용하면,

style 태그가 지정된 HTML 파일 전체에 CSS가 적용됩니다.

 

 

See the Pen Untitled by HelloHailie (@hellohailie) on CodePen.

 

 

3. external

마지막으로 CSS 파일을 따로 작성하고, 그 파일을 link 하여 사용하는 방법입니다.

위 예제는 cssfile.css 파일을 따로 작성하여 저장하고 HTML 파일에서는 line 태그를 이용하여 작성한 파일을 링크하였습니다.

이 방법을 사용하면 CSS 파일 하나를 작성하여 여러 HTML 파일에 공통적으로 적용할 수 있습니다.

 

 

3-1. external / import

 

 

 

import "src/styles.css"; 추가하기

=> src폴더 안에 있는 'style.css'추가해줘.

 

import "./styles.css";

=> 같은 경로에 있으면 ./style.css로 적기