1 Text formatting

Headings can be defined as shown below.

## Level 2 heading  
### Level 3 heading  
#### Level 4 heading  
##### Level 5 heading  
###### Level 6 heading

1.1 Level 2 heading

1.1.1 Level 3 heading

1.1.1.1 Level 4 heading

1.1.1.1.1 Level 5 heading
1.1.1.1.1.1 Level 6 heading

Six custom classes are defined for text scaling. This can be defined inside a paragraph (<p>) or <span>.

<span class="largest">Largest text.</span>   
<span class="larger">Larger text.</span>  
<span class="large">Large text.</span>  
Normal text.  
<span class="small">Small text.</span>  
<span class="smaller">Smaller text.</span>  
<span class="smallest">Smallest text.</span>

Largest text.
Larger text.
Large text.
Normal text.
Small text.
Smaller text.
Smallest text.

A horizontal line can be created using three or more * or -.

***

This is __Bold text__ This is Bold text
This is _Italic text_ This is Italic text
~~Strikethrough~~ text Strikethrough text
This is Subscript H~2~O displayed as H2O
This is Superscript 2^10^ displayed as 210
This is a [link](r-project.org) This is a link
An example of footnote reference 1

> This is a block quote. This
> paragraph has two lines.
>
> 1. This is a list inside a block quote.
> 2. Second item.

This is a block quote. This paragraph has two lines.

  1. This is a list inside a block quote.
  2. Second item.

Icons from FontAwesome can be displayed using the HTML <i> tag. Note that not all icons may work.

Here is a <i class='fa fa-calendar'></i> calendar and a <i class='fa fa-couch'></i> couch.

Here is a calendar and a couch.

2 Code formatting

Code can be defined inline where `this` looks like this. Code can also be defined inside code blocks.

```
This is code
```

This is code

Code formatting can also be achieved by four spaces

    This is code

This is code

3 Lists

3.1 Bulleted List

Unordered lists are created using asterisks.

  • Bullet 1
  • Bullet 2
    • Sub-bullet 2.1
    • Sub-bullet 2.2
  • Bullet 3

Ordered lists are created using numbers.

  1. Point 1
  2. Point 2
  3. Point 3

4 Images

4.1 Using Markdown

Using regular markdown.

![](assets/cover.jpg)

The dimensions are based on image and/or fill up the entire available space. You can control the dimension as shown below.

![](assets/cover.jpg){width=30%}

This image above is now 30% of it’s original width.

4.2 Using HTML

This image below is 30% size.
<img src="assets/cover.jpg" style="width:30%;"/>

This image below is 30% size, has shadow and corners rounded.
<img src="assets/cover.jpg" style="width:30%;" class="fancyimage"/>

5 Tables

Simple tables can be created using markdown. Below is an example of a table.

|Sepal.Length|Sepal.Width|Petal.Length|Petal.Width|Species|
|---|---|---|---|---|
|5.1|3.5|1.4|0.2|setosa|
|4.9|3.0|1.4|0.2|setosa|
|4.7|3.2|1.3|0.2|setosa|

which renders into an HTML table

Sepal.Length Sepal.Width Petal.Length Petal.Width Species
5.1 3.5 1.4 0.2 setosa
4.9 3.0 1.4 0.2 setosa
4.7 3.2 1.3 0.2 setosa

End of document.

  1. That reference refers to this footnote.↩︎