[CSS]word-break

CSS 작성 중 word-break 에 대해서 정리하고 넘어가보려고 합니다.

1. word-break: normal;

일반적인 규칙에 따라 줄 긑에서 단어를 분리할 수 있습니다.

2. word-break: break-all;

break-all을 사용하게 되면 단어 자체 내에서도 단어가 콘텐츠 상자를 초과하는 경우 언제든지 단어가 끊어질 수 있습니다.

3. word-break: keep-all;

keep-all을 사용하게 되면 단어 내 끊김을 방지합니다.
단어 사이에 공백을 사용하지 않는 언어에 특히 유용합니다.

4. word-break: break-word;

break-all과 유사하며 두 문자 사이의 구분을 허용하지만 공백에서 구분할 기회가 있는 경우 단어 내에서 구분을 방지합니다.

 

참고문서 : MDN word-break