white-space속성 / pre태그

pre태그

pre태그

pre태그는 텍스트를 그대로 표시하며, 텍스트 내의 공백, 줄바꿈, 탭 등을 그대로 유지한다

  1. 스페이스(&nbsp ;)/탭(&Tab ;)/엔터(br태그)은 보통 공백하나로 처리되지만 pre를 사용할 경우 그대로 유지되어 표시됨

  2. html 태그도 그대로 표시됨

  3. width가 있을 경우 이를 무시하고 표시됨 (즉 width를 넘어도 줄바꿈안됨)

  4. white-space: pre-wrap를 적용할 경우 width에 맞게 개행됨

  5. white-space : pre 속성과 동일

white-space속성

공백 여러개를 하나의 공백으로 처리하는가,

줄바꿈을 하는가에 의해 속성이 나눠짐

속성명

설명

normal

연속된 공백, 줄 바꿈을 하나의 공백으로 표시됩니다. 넓이(width)에 맞게 줄바꿈한다

nowrap

normal와 기본적으로 같다. 그러나 넓이를 초과해도 줄바꿈하지 않는다

pre

연속된 공백을 그대로 표시합니다. 또한 긴 줄도 줄 바꿈하지 않고 표시합니다. (pre태그동일)

pre-wrap

pre와 기본적으로 같다. 그러나 넓이를 초과하는 경우 줄바꿈한다

실제 표시 되는 화면 예제

참조이미지이미지참조사이트


참조

pre태그

white-space속성

Nov 24, 2023 Views 213