HTML

[HTML] HTML / pre / tag to output as you type

OOQ 2022. 8. 12. 09:32
728x90
SMALL

#HTML

#pre

#tag to output as you type

pre

HTML recognizes multiple consecutive spaces, tabs, and line breaks as a single space. For example, the content of the following document is displayed on one line:

<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>HTML</title>
  </head>
  <body>
    Lorem ipsum dolor.
      Lorem ipsum dolor.
    Lorem ipsum      dolor.
  </body>
</html>

To output as you type, use the pre tag. The default font is fixed width font.

<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>HTML</title>
  </head>
  <body>
    <pre>
    Lorem ipsum dolor.
      Lorem ipsum dolor.
    Lorem ipsum      dolor.
    </pre>
  </body>
</html>

allow automatic line breaks


If you use the pre tag, if the sentence is long, it will go out of the area without line breaks.

<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>HTML</title>
  </head>
  <body>
    <pre>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet. Proin gravida velit dictum dui consequat malesuada.
    </pre>
  </body>
</html>

Add word-wrap: break-word; to the style for automatic line breaks at the end of the region.

<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>HTML</title>
    <style>
      pre {
        word-wrap: break-word;
      }
    </style>
  </head>
  <body>
    <pre>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet. Proin gravida velit dictum dui consequat malesuada.
    </pre>
  </body>
</html>
728x90
LIST