텍스트 줄바꿈 명령어

보통은 공부나 개발하다가 모르는게있고 신기한게있으면 찾아보고 검색해보면서 배워나가는데 이상하게 style 속성쪽 CSS는 하다가 막혀도 궁금하지도않고 웬만하면 접하고싶지가 않다.

이번에도 그냥 출력되는대로 쓰고싶었는데 고정시키라고 하셔서 어쩔수없이 접하게됨 ㅜ

HTML 내에서 width 속성을 지정해놨더라도 DB에서 불러오는 값의 크기가 커서 경계선이 무너지는 경우가 종종있다.

경계선이 무너져서 1줄에 출력되야하는 다른 것들까지 2줄출력이 되어 디자인이 깨지는 현상이 발생하는데 그럴땐 word-break를 사용하면 된다.

<style="word-break:normal"/>

단어단위로 줄바꿈이 된다.

<style="word-break:break-all"/>

단어고 뭐고 그냥 할당된 크기의 화면만큼 꽉 채우면 다음줄로 줄바꿈을 한다.

<style="word-break:break-word"/>

normal이랑 차이점을 잘 모르겠다.

<style="word-break:nowrap"/>

줄바꿈 안하고 한줄로 출력