CSS/ CSS 확장자 따로 만들기 (css를 한번만 만들어서 일일이 바꾸는 불편함 감소하기) : 중복의 제거

●해당 CSS 관련 글 들은 제가 알아보기 쉽게 메모장 형식으로 쓴 것이며, 실제 내용과 상이할 수 있으며, 제가 알아보기 쉽게 쓴 글로써, 읽으실 때 참고만 하시길 권장드립니다. 대부분의 내용은 생활코딩을 참고하였습니다. 출처를 밝힙니다.

 

예전에는 HTML 부분에 CSS부분을 한 페이지를 수정하면 다른 페이지도 다 일일이 하나씩 수정해야 했기 때문에

 

이 부분을 해결하기 위해 CSS 확장자를 따로 만들고,

 

간편하게 사용했다. 방법은 이러하다.

 

우선 파일을 만드는 데 "이름/css"으로 만든다.(이름은 상관없다.)

 

만든 다음 head부분에 넣어놓았던 style태그에 속성들을 전부 이 곳으로

 

복사 붙여넣기한다(미리 확장자를 만들어 놨다면, 그냥 이름/css에 미리 써놓아도 된다)

 

그다음에는 head에다가 이런 식으로 작성한다.

 

<link rel="stylesheet" type="text/css" href="http://localhost/style.css">

 

link라는 태그 안에, rel은 stylesheet로 작성하고, (html과 css와의 관계를 설명해줌)

 

type은 text/css로 써준다.

 

herf 서버컴퓨터가 열려있다는 가정하에 어디에 CSS확장 파일이 있는지 위치를 적어준다.

 

이로써, 일일이 스타일태그를 넣어서 꾸밀 필요 없으며, 확장자 css파일을 만들어 html을 꾸밀 수 있다.

 

그리고 주의할 것이 있다.

 

이름/css 파일을 만들고 나서,

 

<style>태그를 같이 가져가는 것이 아니라

 

스타일태그 안에 속성들만 가져가서 복붙 하는 것이다.