Skip to content

Demo Page for MkDocs Material

Text Formatting

  • Bold
  • Strikethrough
  • Italic
  • Highlight

MarkDown Table

Method Description
GET Fetch resource
PUT Update resource
DELETE Delete resource

Admonitions

Note

This is an Admonition with default header

This is an Admonition with no header

Admonition

This is an Admonition with customised-text header

Collapsible Admonition

This is an Collapsible Admonition with customised-text header

def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere in sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis. Etiam ipsum quam, mattis in purus vitae, lacinia fermentum enim.

Tldr

Other types of Admonitions

Info

Other types of Admonitions

Tip

Other types of Admonitions

Success

Other types of Admonitions

Question

Other types of Admonitions

Warning

Other types of Admonitions

Failure

Other types of Admonitions

Code Blocks

Basic Code Block

def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Code Block with Line Number starting at 1

1
2
3
4
5
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Code Block with Line Numbers starting at 6 and Highlighted lines

 6
 7
 8
 9
10
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Multiple-language Tabs

1
2
3
4
5
6
#include <stdio.h>

int main(void) {
  printf("Hello world!\n");
  return 0;
}
1
2
3
4
5
6
#include <iostream>

int main(void) {
  std::cout << "Hello world!" << std::endl;
  return 0;
}
1
2
3
4
5
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello, World!"); 
    }
}
1
2
def main():
    print("Hello world!")
1
2
3
4
5
6
package main

import "fmt"
func main() {
    fmt.Println("hello world")
}

Math Formulas using LaTeX

\[X = \sum_{i=0}^k d^k =\frac{1 - d^{k+1}}{1-d}\]
\[X(1-d) = 1 - d^{k+1}\]
\[1 - X(1-d) = d^{k+1}\]
\[1 - X + dX = d^{k+1}\]
\[{k+1} = \log_d (1 - X + dX)\]
\[k = \log_d (1 - X + dX) - 1\]

Images

Just use HTML instead of MarkDown syntax for fine control over dimensions and margins.

Centered image with caption

Complete Documentation: https://squidfunk.github.io/mkdocs-material/reference/abbreviations/