Style guide

Headings

Heading level 1 with example link

Heading level 2 with example link

Heading level 3 with example link

Heading level 4 with example link

Heading level 5 with example link
Heading level 6 with example link

Horizontal rule


Lists

Text

A paragraph (from the Greek paragraphos, to write beside or written beside) is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.

A block quotation (also known as a long quotation or extract) is a quotation in a written document, that is set off from the main text as a paragraph, or block of text, and typically distinguished visually using indentation and a different typeface or smaller size quotation. Citation link

This is a text link

Example of block quotation wrapped in quotes Example citation

Strong is used to indicate strong importance

This text has added emphasis

The b element is stylistically different text from normal text, without any special importance

The i element is text that is set off from the normal text

The u element is text with an unarticulated, though explicitly rendered, non-textual annotation

This text is deleted and This text is inserted

This text has a strikethrough

Superscript

Subscript

This small text is small for fine print, etc. example link

Abbreviation: HTML

Keybord input: Cmd

This text is a short inline quotation. With another quotation inside it.

This is a citation

The dfn element indicates a definition.

The mark element indicates a highlight

This is sample output from a computer program

The variable element, such as x = y

A timestamp, such as

P R E F O R M A T T E D T E X T P R E F O R M A T T E D T E X T
! " # $ % & ' ( ) * + , - . /
0 1 2 3 4 5 6 7 8 9 : ; =
@ A B C D E F G H I J K L M N O
P Q R S T U V W X Y Z [ \ ] ^ _
` a b c d e f g h i j k l m n o
p q r s t u v w x y z { | } ~

<div class="example">This is what inline code looks like.</div>

<script>
  // This is what a highlighted code block looks like
  // Sample script
  window.console && console.log('foo');
  var lang = /\blang(?:uage)?-(?!\*)(\w+)\b/i;
</script>
<style>
  /* Sample style */
  .sample {
    background: url(none);
    content: "test";
    margin: 0 !important;
  }
</style>
<div>
  <!-- Sample HTML -->
  <p class="sample">This is an sample pattern</p>
</div>