-
[CSS] 줄바꿈 기준 word-break 속성 (normal, keep-all, break-all)프론트엔드 2022. 1. 1. 23:32
word-break 속성을 통해 단어 단위로 줄바꿈을 할지, 글자 단위로 줄바꿈을 할지 설정할 수 있다.
단어 단위로 줄바꿈을 한다는 것은, 이렇게 컨텐츠 크기가 길어질 때 단어를 쪼개지 않고 줄바꿈을 하는 것을 말한다.
글자 단위로 줄바꿈을 하는 것은, 이렇게 컨텐츠 크기가 길 어질 때 단어를 쪼개고 글자 단위로 줄바꿈을 하는 것이다.
옵션은 normal, keep-all, break-all 세 가지가 있다.
- normal (기본값) : 영어는 단어 단위로 줄바꿈, 한글은 글자 단위로 줄바꿈
- keep-all : 영어, 한글 모두 단어 단위로 줄바꿈
- break-all : 영어, 한글 모두 글자 단위로 줄바꿈
참고 : https://developer.mozilla.org/ko/docs/Web/CSS/word-break
'프론트엔드' 카테고리의 다른 글
[Github Pages/깃헙페이지] gh-pages 배포 시 favicon이 안 뜰 때 해결 방법 (0) 2022.01.03 [React] 이메일 전송 폼 만들기 - EmailJS (0) 2022.01.02 VSCode React styled-components 스니펫 (0) 2021.12.29 [React] create-react-app (CRA) 에러 해결 : no longer support global installation of Create React App. (0) 2021.12.27 JavaScript 30 Challenge - 자바스크립트 프로젝트 만들기 (0) 2020.05.01