DEV Community

Cover image for HTML tags | pre
Carlos Espada
Carlos Espada

Posted on • Edited on

HTML tags | pre

It is used to display text as it has been written in the HTML, keeping spaces and line breaks.

The browser will display the text using the default monospaced font, unless it is overwritten with CSS.

When using preformatted text to represent an image or diagram, it is important to provide an alternate description for people who use assistive technology to navigate, such as a screen reader. To do this, a combination of <figure> and <figcaption> will be used, plus a combination of an id and the role and aria-labelledby attributes as follows:

 ___________________________
< I'm an expert in my field. >
 ---------------------------
        \   ^__^
         \  (oo)\_______
            (__)\       )\/\
                ||----w |
                ||     ||
 
A cow saying, "I'm an expert in my field." The cow is illustrated using preformatted text characters.
  • Type: block
  • Self-closing: No
  • Semantic value: No

Definition and example | Support

Heroku

This site is built on Heroku

Join the ranks of developers at Salesforce, Airbase, DEV, and more who deploy their mission critical applications on Heroku. Sign up today and launch your first app!

Get Started

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more