01. css style _ 스타일 적용방법

css는 앞서 말했듯 html로 잡은 구조를 꾸며주는 기능을 합니다.
css 사용시 3가지 방법이 있습니다. 대충 방법만 숙지하고 넘어갑니다.

inline style

태그에 직접 코딩하는 것을 말합니다.
제 1순위로 적용이 되므로 급할때 쓰면 좋습니다.
하지만 나중에 유지보수나 수정이 힘들기 때문에 가급적 쓰지 않도록 합시다.
빨간 네모 안 처럼 태그의 여는 부분 뒤에 style=""를 넣어주고 그 사이에 작성하면 됩니다.

내부 스타일 시트

html 문서 안 head 사이에 을 입력 후 style태그 안쪽에 css를 입력합니다.
style이 들어간 html 문서 안 모든 태그에 영향을 줍니다.
벗, 다른 페이지에서 똑같은 css를 사용하고 싶다면 똑같이 복사해서 또 넣어야 하므로 낭비낭비입니다.
그래서 내부 스타일 시트의 경우 특이하게 이 페이지에만 적용되는 스타일이 있을때 사용하면 좋습니다.
또한 지금처럼 공부할 때 코드를 간단하고 한눈에 보기 위해 자주 사용합니다.
태그명이나 id, class 등으로 선택해서 사용합니다.

외부 스타일 시트

가장 보편적으로 쓰이는 방법으로 유지보수가 쉽고 같은 스타일을 여러 페이지에 적용할 때 유용합니다.
따로 css파일을 만들어 link로 연결해 주는 방법입니다.
자세히 봅시다.

사이드에서 폴더 위에서 우클릭 후 New > Folder를 클릭하여 css폴더를 생성합니다.
꼭 만들어야 하는건 아니지만 나중에 규모가 커질수록 따로 분리하여 정리하는 것이 편합니다.
세살 버릇이 여든 갑니다.

방금 만든 css폴더 위에서 우클릭하여 New From Template > CSS 클릭해서 스타일시트 만듭니다.
이때 주의할점은 html문서 생성시와 같이 뒤에 확장자명 css를 꼭 붙여줘야 합니다.
파일명.css 요렇게요

이 스타일시트에 아까 내부스타일 시트때와 마찬가지로 넣어주면 됩니다.

넣었으면 이어줘야겠지요.
head태그 안에 link태그로 아까 만든 스타일시트를 이어주면 됩니다.

* 개인적인 공부를 정리하는 블로그입니다.