[웹 프로그래밍]html 스타일 적용 방법(css)

1. css파일 연결

html파일에 <link>태그를 넣어 연결한다

css파일에서 스타일링 하고자 하는 태그(여기서는 h1태그)의 속성을 입력한다.

2. style태그 사용

html파일 안에 style태그를 만들어&nbsp;스타일링 하고자 하는 태그(여기서는 h1태그)의 속성을 입력한다.

 

3. Inline style

원하는 태그 안에 style 태그를 추가하는 방법. 앞의 두 방법과 달리 " 사이에 스타일링 내용이 들어간다.

 

* 두 가지 이상의 방법이 동시에 사용된다면?

우선순위에 따라서 순위가 높은 쪽이 우선적으로 적용된다.

---

적용 우선순위: !important ← inline stye ← #id ← .class ←tag

---

우선순위 최상위에 있는 !important가 여러 개이면 나중에 적힌 것이 우선이 되는 등 우선순위 관리하기가 쉽지 않아지므로, 가능하면 tag, .class, #id선에서 끝내는게 좋다.

(예1)위 세 가지 방법을 동시에 사용했다면 가장 우선순위가 높은 inline style방법에 의한 스타일링이 적용된다. 참고로 css파일에는 h1태그를 green색상으로 바꾸는 내용이 입력되어 있다.

(예2)style태그에 !important문구를 넣으면 적용 우선순위가 가장 높아져 inline style이 있더라도 무시하고 style태그가 우선 적용된다.