[CSS] overflow-wrap과 word-break

Slowly But Surely·2024년 2월 15일
0

먼저 이 두 속성은 모두 알파벳에만 영향을 주고, CJK(한글 및 한자)에는 영향을 주지 않는다. 한글 등은 단어 단위로 보지 않고 한 단어 내에서도 무조건 줄을 바꾼다.

  1. overflow-wrap: anywhere
  • Readability를 보장하기 위해 hyphen, space, 물음표 등이 있으면 그곳을 기점으로 다음 줄로 넘김
  • hyphen, space 등이 없는 긴 단어가 있으면, width 넘어가면 무조건 끊음.
  1. word-break: break-all
  • hyphen, space 등 고려하지 않고 무조건 한 줄 꽉 채운 다음에 끊음.
  • 오래된 브라우저에서도 지원되는 속성. 위의 속성보다 더 오래 전에 만들어진 속성이기 때문.
  • url, path 등 길어질 수 있고 human readability와 무관한 곳에 사용하면 좋다.
profile
안녕하세요

0개의 댓글