Display blocks of code in html

Updated: 11-6-2019

Background Info

Code Blocks: Displaying code blocks on a web page is a great way to share information with other developers. HTML has a few dedicated tags to displaying code. Example: x = list()

Why is this important?
Sharing information is a great way to learn, and help others learn. The developer community is an essential part to programming, and adding to this knowledge base keeps the field healthy, and growing.

Use the Pre and Code tags to display pieces of computer code in HTML.


Step 1: Copy and Paste html code into a text editor.


Step 2: Replace <,>, & with the following characters:

Convert HTML using online HTML Escape/Unescape programs.

  1. Replace the &lt; character with &amp;
  2. Replace the < character with &lt;
  3. Replace the > character with &gt;


Step 3: Wrap text with Pre and Code tags.


Step 4: Copy and paste code onto html page