HyunJun 기술 블로그

HTML <pre> Element, ASCII art 본문

HTML

HTML <pre> Element, ASCII art

공부 좋아 2023. 6. 8. 09:28
728x90
반응형

1. pre element


<pre> 태그는 미리 정의된 형식(preformatted)의 텍스트를 정의할 때 사용합니다.

 

  • <pre> 요소 내의 텍스트는 시스템에서 미리 지정된 고정폭 글꼴(fixed-width font)을 사용하여 표현되며, HTML 코드(텍스트)에 사용된 여백과 줄바꿈이 모두 그대로 브라우저에 표현됩니다.
  • 이러한 <pre> 요소를 사용하면, 독특한 서식의 텍스트나 컴퓨터 코드 등을 HTML 문서에 그대로 표현할 수 있습니다.

2. ASCII art로 <pre> 확인하기.

텍스트를 이미지화(텍스트) 해서 표현해 주는 ASCII art를 ASCII Generator를 사용해서<pre> 태그에 바로 적용해 보겠습니다.

텍스트 내용을 그대로 <pre>에 넣어보겠습니다.

  <pre>
    _   _  ____  __  __  __      ____  ____  ____    ____   __    ___ 
   ( )_( )(_  _)(  \/  )(  )    (  _ \(  _ \( ___)  (_  _) /__\  / __)
    ) _ (   )(   )    (  )(__    )___/ )   / )__)     )(  /(__)\( (_-.
   (_) (_) (__) (_/\/\_)(____)  (__)  (_)\_)(____)   (__)(__)(__)\___/
  </pre>

 

아스키 아트가 잘 나왔습니다.

이와 같이 미리 정의된 형식을 표현할 때 사용할 수 있습니다.

728x90
반응형
Comments