CSS 를 이용한 Html 텍스트 자동 줄바꿈

정해진 틀안에서 글을 출력해야 되는 경우등이 있을때 사용하는 CSS 속성들

잘 사용을 하지 않다보니 작업할때마다 찾아서 사용할려고 스크랩 해둡니다.

 

white-space 속성값
normal : 기본값으로 글자 줄이 자동으로 바뀝니다. 콘텐츠가 요소의 너비를 초과할 경우 다음 줄로 바뀝니다.
nowrap : 줄 바꿈이 실행되지 않습니다. 즉, 콘텐츠가 다음 줄로 바뀌지 않습니다.
pre : 줄 바꿈과 기타 공백이 유지됩니다. (이 속성값은 !DOCTYPE 선언에서 표준 준수 모드를 지정할 경우에 지원되고 !DOCTYPE 선언에서 표준 준수 모드를 지정하지 않으면 이 값을 검색할 수는 있지만 렌더링에 양향을 주지 않으며 normal 값처럼 동작합니다.
pre-line : 줄 바꿈 시퀀스가 유지됩니다.
pre-wrap : 줄 바꿈 시퀀스가 축소됩니다.
inherit : 부모 요소로부터 값을 상속 받습니다.

word-wrap 속성값
normal : 기본값으로 콘텐츠가 컨테이너 경계를 초과합니다.
break-word : 콘텐츠가 다음 줄로 넘어가고 필요한 경우 단어 줄 바꿈이 발생합니다.

word-break 속성값
normal : 평소 규칙대로 단어를 분리합니다.
break-all : 단어가 문자별로 분리되어 단어의 중간에도 줄 바꿈이 됩니다.
keep-all : 문자별로 분리되는 것을 금지합니다.

word-spacing 속성값
normal : 기본값으로 기본 간격을 나타냅니다.
length(길이) : 부동 소수점 숫자 뒤에 절대 단위 지정자(cm , mm , in , pt , pc) 또는 상대 단위 지정자(em , ex , px)가 오는 값입니다.
inherit : 부모 요소로부터 값을 상속 받습니다.