CSS 다루기

김민재·2021년 6월 16일
0

Gotcha JavaScript!

목록 보기
24/45

Cascading Style Sheet

  • HTML 문서의 요소가 어떻게 표시될지 정의

Style을 적용할 element의 selector

[selector] { [property_name]:[value]; ... }
  1. selector : tag이름, id, class로 작성 가능하다.
    -tag이름 : 태그 이름 그대로 사용(h1, h2, p, img, ...)
    -id : #을 붙이고 id 사용(#name, #id, ... )
    -class : .을 붙이고 class 이름 사용 (.lyric, ...)
  2. property_name : selector에 해당하는 엘리먼트의 style 속성
  3. value : 앞에 정의한 style property의 값

적용하는 3가지 방법

  1. head 태그 안에 태그 사용
 <link rel="stylesheet" href="[css file]">
  1. head 태그 안에
 <style>
       ...
 </style>
  1. html element안에 직접 속성으로 정의
<p style="color:red">...</p>

CSS 적용 우선순위

  1. html element 안에서 적용한 스타일
  2. style tag안에서 적용한 스타일
  3. link를 통해 외부 파일에서 적용한 스타일
profile
자기 신뢰의 힘을 믿고 실천하는 개발자가 되고자합니다.

0개의 댓글