Programming for beginners: Markdown: lists

Markdown offers two ways for specifying list of information.

a. Ordered lists

b. Unordered lists

Ordered lists

Ordered list is a collection of items that maintains order. You can create ordered lists by using numbers following by dot (.).

ordered_list.md

> # Object Oriented Programming Languages
1. Java
2. C++
3. Ada
4. C#

> # Functional Programming Languages
1. Haskell
2. Lisp
3. Groovy

Following is the preview for above markdown file.

Following is the html code for above markdown file.

<?xml version='1.0' encoding='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
  <blockquote>
    <h1 id="object-oriented-programming-languages">Object Oriented
      Programming Languages</h1>
    <ol>
      <li>Java</li>
      <li>C++</li>
      <li>Ada</li>
      <li>C#</li>
    </ol>
  </blockquote>
  <blockquote>
    <h1 id="functional-programming-languages">Functional Programming
      Languages</h1>
    <ol>
      <li>Haskell</li>
      <li>Lisp</li>
      <li>Groovy</li>
    </ol>
  </blockquote>
</body>
</html>

Unordered lists

Unordered list is a collection of items, it don't maintail any order (or) sequence.

Unordered lists use asterisks(*), pluses(+), and hyphens(-) as markers.

unordered_list.md

> # Object Oriented Programming Languages
* Java
* C++
* Ada
* C#

> # Functional Programming Languages
+ Haskell
+ Lisp
+ Groovy

> # Procedure Programming Languages
- ALGOL
- COBRA
- COBOL

Following is the preview for above file.

Following is the html for above markdown file.

<?xml version='1.0' encoding='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
  <blockquote>
    <h1 id="object-oriented-programming-languages">Object Oriented
      Programming Languages</h1>
    <ul>
      <li>Java</li>
      <li>C++</li>
      <li>Ada</li>
      <li>C#</li>
    </ul>
  </blockquote>
  <blockquote>
    <h1 id="functional-programming-languages">Functional Programming
      Languages</h1>
    <ul>
      <li>Haskell</li>
      <li>Lisp</li>
      <li>Groovy</li>
    </ul>
  </blockquote>
  <blockquote>
    <h1 id="procedure-programming-languages">Procedure Programming
      Languages</h1>
    <ul>
      <li>ALGOL</li>
      <li>COBRA</li>
      <li>COBOL</li>
    </ul>
  </blockquote>
</body>
</html>

Note

Some times you may trigger an ordered list by accident like below.

world_wars.md

1914. World War 1 starts
1918. World War 1 ends
1939. World War 2 starts
1945. World War 2 Ends

Above markdown file generates following html code.

<?xml version='1.0' encoding='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
  <ol>
    <li>World War 1 starts</li>
    <li>World War 1 ends</li>
    <li>World War 2 starts</li>
    <li>World War 2 Ends</li>
  </ol>
</body>
</html>

But you want to display the years. To avoid this, you can backslash-escape the period.

world_wars.md
1914\. World War 1 starts
1918\. World War 1 ends
1939\. World War 2 starts
1945\. World War 2 Ends

Above markdown file generates following html code.

<?xml version='1.0' encoding='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
  <p>1914. World War 1 starts 1918. World War 1 ends 1939. World War
    2 starts 1945. World War 2 Ends</p>
</body>
</html>

Following is the preview for above markdown file.

Observe above image, all the data is displayed in same line. To display each statement in separate line, you must end a line with two or more spaces then type return.

I added to spaces after each statement in world_wars.md file.

world_wars.md

1914\. World War 1 starts  
1918\. World War 1 ends  
1939\. World War 2 starts  
1945\. World War 2 Ends

Following is the preview for above markdown file.

Following is the html for above markdown file.

<?xml version='1.0' encoding='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
  <p>
    1914. World War 1 starts<br /> 1918. World War 1 ends<br /> 1939.
    World War 2 starts<br /> 1945. World War 2 Ends<br />
  </p>
</body>
</html>

Previous Next Home

Programming for beginners

Tuesday 26 April 2016

Markdown: lists

No comments:

Post a Comment