[FC] CSS 파일분리 / CSS 불러오기

CSS파일은 한 번 정해지면 바뀌지 않는 정적 파일임

CSS파일도 파일 분리 및 파일 불러오기 가능

 

파일분리하면 좋은점

기존 html파일에 style을 작성하면 해당 html파일에만 적용가능했으나

파일분리를 통해 다른 html파일에도 적용가능해짐. 중복사용가능

 

주소에 존재하는 외부 CSS 문서 불러오기 코드

<link rel="stylesheet" type="text/css" href="css파일이 존재하는 주소">

 

type : css타입+text타입

rel : relation의 약자. 불러오는 파일과 html과의 관계를 설명. 스타일시트 관계

 

스타일 상속의 예시.

box스타일 적용시키기 / 부모태그 / 자식태그

box모델과 관련된 속성은 상속이 되지 않는다.

div하위 태그인 p태그 각각에 border영역이 표시되지 않고 div태그(부모태그)에만 적용

 

height적용시키면

width적용시키면

엘리먼트 단위로 작성한 CSS코드가 우선순위를 갖는다.

 

결론

div태그의 자식요소인 h1, p태그에는 박스모델과 관련된 속성은 상속되지 않음.

단, 나머지(폰트,색상,..)은 상속가능