[CSS] 공백 처리 방법을 정하는 white-space

white-space는 스페이스와 탭, 줄바꿈, 자동줄바꿈을 어떻게 처리할지 정하는 속성입니다. 

 

 

📌 속성값

 

white-space의 속성 값으로는 normal, nowrap, pre, pre-wrap, pre-lline, initial, inherit 이 있습니다.

 

initial : 기본 값으로 설정합니다.

inherit : 부모 요소의 속성값을 상속받습니다.

	스페이스와 탭	줄바꿈	자동 줄바꿈
normal	병합	병합	O
nowrap	병합	병합	X
pre	보존	보존	X
pre-wrap	보존	보존	O
pre-line	병합	보존	O

 

• 스페이스와 탭 : 연속된 스페이스와 탭의 처리방법. 
  • 병합은 1개의 공백으로 바꾸는 것이고, 보존은 입력된 그대로 출력하는 것입니다.
• 줄바꿈 : 줄바꿈의 처리방법
  • 병합은 1개의 공백으로 바꾸는 것이고, 보존은 입력된 그대로 출력하는 것입니다.
• 자동 줄바꿈 : 내용이 영역의 크기를 벗어날 때 처리방법입니다. 
  
  • O 는 자동으로 줄바꿈하여 영역 내에 내용을 표시하는 것이고, X 는 영역을 벗어나더라도 입력된 대로 출력하는 것입니다.