css 문법 : <div>와<span>, 선택자

ch9eri·2022년 2월 19일
0

html/css

목록 보기
3/6

🟢 div와 span의 차이점

1. 줄바꿈

: div는 줄 바뀜, span은 줄 안 바뀜

2. 지정 영역

: div는 박스단위, span은 문장단위

ex) 문단의 배경색을 지정하면 div는 직사각형 형태로 나타나고, span은 문장마다 길이가 다른 줄의 집합이 나타난다


🟢 선택자 (class, id)

id

- 식별 (정확한 타겟팅) -> 예외처리시 사용할 수 있음

- 동일한 id는 무조건 한번만

class

- 그룹화 (포괄적)

- 명시할 때 앞에 .(온점) 후 선언

📌 우선순위 : id > class > span


⌨️ 예시

#css

    .js{
      font-weight: bold;
      color:red;
    }
    #first{
      color:green;
    }
    span{
      color:blue;
    }

#html

<p>
    <span id="first" class="js">JavaScript</span> (/ˈdʒɑːvəˌskrɪpt/[6]),
  often abbreviated as JS, is a high-level, dynamic, weakly typed,
  prototype-based, multi-paradigm, and interpreted programming language.
  Alongside <span>HTML</span> and <span>CSS</span>,
  <span class="js">JavaScript</span> is one of the three core 
  technologies of World Wide Web content production.
</p>

🖥 출력

profile
잘하자!

0개의 댓글