1 개요[ | ]
- CSS word-break property
- CSS word-break 속성
- 단어 내부에서 줄바꿈할 것인지를 지정하는 CSS 속성
값 | 설명 |
---|---|
normal | 기본 줄바꿈 규칙에 따름 ( 기본값. 영어는 붙여쓰고 CJK는 줄바꿈 ) |
keep-all | 모두 줄바꾸지 않음 ( 한글도 붙여씀 ) |
break-all | 모두 줄바꿈 ( 영어도 줄바꿈 ) |
break-word | 가능한 한 단어 단위로 줄바꿈, 단어 단위가 지나치게 긴 경우 중간에서 줄바꿈시킴 ( 한글, 영어 공통 ) |
2 예시[ | ]
html
Copy
<style>
p { width: 120px; background: yellow; border: 1px solid red; }
</style>
<p style='word-break: normal'>
Let's say Supercalifragilisticexpialidocious!
말해보자, 수퍼캘리프래질리스틱익스피얄리도셔스!
????????????????????????????????????????
</p>
<p style='word-break: keep-all'>
Let's say Supercalifragilisticexpialidocious!
말해보자, 수퍼캘리프래질리스틱익스피얄리도셔스!
????????????????????????????????????????
</p>
<p style='word-break: break-all'>
Let's say Supercalifragilisticexpialidocious!
말해보자, 수퍼캘리프래질리스틱익스피얄리도셔스!
????????????????????????????????????????
</p>
<p style='word-break: break-word'>
Let's say Supercalifragilisticexpialidocious!
말해보자, 수퍼캘리프래질리스틱익스피얄리도셔스!
????????????????????????????????????????
</p>
3 같이 보기[ | ]
4 참고[ | ]
편집자 Jmnote Jmnote bot 포타슘
로그인하시면 댓글을 쓸 수 있습니다.