Test HTML code snippet shown using xmp (deprecated), pre and code tags

Chrome (and blogger posts displayed in Chrome) interprets HTML code inside <pre> </pre>  or <code> </code> tags unless they are escaped. If the HTML code shown below under xmp tag is used as is (not escaped) within code or pre tags, Chrome shows "Test document" in large font and bold (so the h1 tag is interpreted).

The xmp tag shows the HTML source code properly for Chrome and Blogger posts displayed in Chrome! However it is deprecated. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/xmp . The page has useful info. in the context of pre and code tags: "Use the <pre> element or, if semantically adequate, the <code> element instead. Note that you will need to escape the '<' character as '&lt;' and the '&' character as '&amp;' to make sure they are not interpreted as markup."

The contents below show some HTML code snippets using xmp (deprecated), pre and code tags. These tags and the contents within them were entered in HTML mode of Blogger New/Edit Post.

Note that xmp tag output is not shown in Compose view of blogger but is shown on preview of the post in Chrome and viewing the post in Chrome.

xmp (deprecated) tag output

<html lang="en"> <head> <title>Document</title> </head> <body> <h1>Test document</h1> </body> </html> Note: For pre and code tags, the above HTML code was escaped using https://www.freeformatter.com/html-escape.html and its output was used within the tags.

pre tag output

      <html lang="en"> <head>
      <title>Document</title> </head> <body>
      <h1>Test document</h1> </body> </html>

code tag output

<html lang="en"> <head> <title>Document</title> </head> <body> <h1>Test document</h1> </body> </html>

Comments

Post a Comment