Drop-in Minimal CSS
This page provides an overview of barebones drop-in minimal CSS boilerplate frameworks. To switch to a different stylesheet, select one of the frameworks from the dropdown menu below. For more information, and links to all the frameworks seen here, visit the project page on GitHub.
Text
Paragraphs
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc viverra viverra nisl, vel maximus turpis ornare a. Ut scelerisque lectus sed odio dictum scelerisque vitae quis nisi. Nulla facilisi. Phasellus vehicula convallis nisl, id suscipit dui semper at. In eu iaculis lorem. In vehicula sed mauris et suscipit. Vivamus pellentesque non massa sit amet ornare. Integer placerat est vitae nisl molestie, eget rhoncus erat vulputate. Proin ornare massa eget bibendum faucibus.
Blockquotes
Etiam porttitor egestas elit, at venenatis neque accumsan eu. Nulla viverra odio nisi, quis commodo tellus tristique non. Proin ac ante at orci euismod eleifend. Quisque nisi sapien, dapibus in venenatis sit amet, posuere non purus. In sit amet metus erat. Pellentesque nec neque eleifend, luctus ipsum at, ullamcorper nunc. Pellentesque sagittis, dolor eu bibendum lacinia, orci ex bibendum risus, at tincidunt augue lacus eleifend diam. Nulla facilisis velit ut est auctor sollicitudin. Morbi eget lectus a lacus maximus molestie in ut lorem.
Vestibulum ut erat sapien. Duis eros est, tempus a rutrum eu, rhoncus at ante. Vestibulum congue vel nunc et dapibus. Ut tristique facilisis orci ac pretium. Nunc et sodales turpis. Nulla pretium augue vitae faucibus tempor. Aliquam convallis mollis feugiat. Ut non pellentesque sem. Suspendisse interdum, neque at hendrerit varius, enim neque imperdiet enim, pellentesque efficitur leo orci non erat.
Said no one, ever.
Lists
Definition list
- Definition List Title
- This is a definition list division.
Ordered List
- List Item 1
- List Item 2
- List Item 3
- Nested Ordered List Item 3.1
- Nested Ordered List Item 3.2
- Nested Ordered List Item 3.3
- List Item 4
- Nested Unordered List Item 4.1
- Nested Unordered List Item 4.2
- Nested Unordered List Item 4.3
Unordered List
- List Item 1
- List Item 2
- List Item 3
- Nested Ordered List Item 3.1
- Nested Ordered List Item 3.2
- Nested Ordered List Item 3.3
- List Item 4
- Nested Unordered List Item 4.1
- Nested Unordered List Item 4.2
- Nested Unordered List Item 4.3
Horizontal rules
Tabular data
Table Heading 1 | Table Heading 2 | Table Heading 3 | Table Heading 4 | Table Heading 5 |
---|---|---|---|---|
Table Footer 1 | Table Footer 2 | Table Footer 3 | Table Footer 4 | Table Footer 5 |
Table Cell 1 | Table Cell 2 | Table Cell 3 | Table Cell 4 | Table Cell 5 |
Table Cell 1 | Table Cell 2 | Table Cell 3 | Table Cell 4 | Table Cell 5 |
Table Cell 1 | Table Cell 2 | Table Cell 3 | Table Cell 4 | Table Cell 5 |
Table Cell 1 | Table Cell 2 | Table Cell 3 | Table Cell 4 | Table Cell 5 |
Code
Keyboard input: Cmd
Inline code: <div>code</div>
Sample output: This is sample output from a computer program.
Pre-formatted text
P R E F O R M A T T E D T E X T " # $ % & ' ( ) * + , - . / 1 2 3 4 5 6 7 8 9 : ; < = > ? A B C D E F G H I J K L M N O 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 q r s t u v w x y z { | } ~
Inline elements
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 offset from the normal text.
The u element is text with an unarticulated, though explicitly rendered, non-textual annotation.
Superscript®.
Subscript for things like H2O.
This small text is small for for fine print, etc.
Abbreviation: HTML
This text is a short inline quotation.
This is a citation.
The dfn element indicates a definition.
The mark element indicates a highlight.
The variable element, such as x = y.
The time element: