Typography Test Page
This page demonstrates the various HTML typographical elements and how they are rendered by the current stylesheet.
Headings
Heading 1 (h1)
Heading 2 (h2)
Heading 3 (h3)
Heading 4 (h4)
Heading 5 (h5)
Heading 6 (h6)
Paragraphs and Text Formatting
This is a standard paragraph (p). It contains some strong text, bold text, emphasized text, and italic text. You can also have marked text, small text, subscript, and superscript.
Here is a hyperlink to show how links look within a paragraph. Inline code blocks are also common in technical writing.
The following is an abbreviation: HTML. We can also use citations, definitions, and keyboard inputs like Ctrl+C.
Lists
Unordered List
- First item
- Second item
- Nested first item
- Nested second item
- Third item
Ordered List
- First item
- Second item
- Nested first item
- Nested second item
- Third item
Description List
- Term 1
- Definition for term 1.
- Term 2
- Definition for term 2.
Blockquote
This is a blockquote. It is used to indicate the quotation of a large selection of text from another source.
Code and Preformatted Text
Preformatted text (pre) is used for code blocks:
function helloWorld() {
console.log("Hello, world!");
}
// This is a comment
helloWorld();
Tables
| Header 1 | Header 2 | Header 3 |
|---|---|---|
| Data 1.1 | Data 1.2 | Data 1.3 |
| Data 2.1 | Data 2.2 | Data 2.3 |
| Footer 1 | Footer 2 | Footer 3 |
Forms (Basic Elements)
Article List (Custom Class)
The stylesheet defines a specific style for ol.article-list:
-
Example Article Title 1 -
Example Article Title 2