【HTML】span과 div의 차이

span

명령문의 일부에 CSS를 적용
~로 둘러싸인 부분을 인라인 요소로서 그룹화

사과의 "응"만 문자를 붉게하고 싶다

예.html

<p>り<span>ん</span>ご</p>

예.css

span {
  color: red;
}

"응"만 빨간색

span과 div의 차이

그룹화라고하면 div도 그렇지만, 무엇이 다른가 하면

span···~로 둘러싼 부분을 그룹화(인라인 요소)
div···로 둘러싼 부분을 그룹화(블록 레벨 요소)

이미지로서는・・・

div
↓


span
↓


div는 블록 레벨 요소를 그룹화하므로 블록에 CSS 적용 (적색 문자)
span 은 둘러싸인 문자를 그룹화해, 그 둘러싸인 부분에 CSS를 적용 (적색 문자)

div에서 과일이라는 큰 프레임 블록에 대해 빨간색 문자로 만들거나,
span 에서 감귤의 "인가"에만 로컬 부분을 적문자로 할까.
그런 느낌.

그건 그렇고, span도 div와 함께 클래스를 사용할 수 있습니다