pre 태그

pre 태그에 텍스트를 작성하면 스페이스, 탭, 엔터 등
모든 공백 요소들이 이와 같이 화면에 그대로 적용됩니다.

때문에 pre 태그는 아래의 아스키 아트(Ascii art)들처럼
공백요소들을 적극 활용해야 하는 경우 유용하게 사용될 수 있습니다.

하지만 스크린 리더는 pre 태그의 내용을 읽지 않으므로
접근성을 위해 추가적인 조치가 필요하죠.
이 부분은 HTML 심화편에서 다루겠습니다.

  

    ,d888a                          ,d88888888888ba.  ,88"I)   d
  a88']8i                         a88".8"8)   `"8888:88  " _a8'
.d8P' PP                        .d8P'.8  d)      "8:88:baad8P'
,d8P' ,ama,   .aa,  .ama.g ,mmm  d8P' 8  .8'        88):888P'
,d88' d8[ "8..a8"88 ,8I"88[ I88' d88   ]IaI"        d8[         
a88' dP "bm8mP8'(8'.8I  8[      d88'    `"         .88          
,88I ]8'  .d'.8     88' ,8' I[  ,88P ,ama    ,ama,  d8[  .ama.g
[88' I8, .d' ]8,  ,88B ,d8 aI   (88',88"8)  d8[ "8. 88 ,8I"88[
]88  `888P'  `8888" "88P"8m"    I88 88[ 8[ dP "bm8m88[.8I  8[
]88,          _,,aaaaaa,_       I88 8"  8 ]P'  .d' 88 88' ,8' I[
`888a,.  ,aadd88888888888bma.   )88,  ,]I I8, .d' )88a8B ,d8 aI
"888888PP"'        `8""""""8   "888PP'  `888P'  `88P"88P"8m"