Design System
Colors
Headings
All HTML headings, <h1>
through <h6>
, are available.
Heading 2 example
Heading 3 example
Heading 4 example
Heading 5 example
Heading 6 example
List Types
Ordered List
An unordered list starts with the <ol>
tag. Each list item starts with the <li>
tag. The list items will be marked with numbers by default:
- List item 1
- List item 2
- Nested list item A
- Nested list item B
- List item 3
- asdf
- asdf
Unordered List
An unordered list starts with the <ul>
tag. Each list item starts with the <li>
tag. The list items will be marked with bullets by default:
- List Item a
- List Item b
- Nested list item 1
- Nested list item 2
- Double Nested item 1
- Double Nested item 2
- List Item 3
Blockquotes
For quoting blocks of content from another source within your document.
Single line blockquote:
Stay hungry. Stay foolish.
Multi line blockquote:
People think focus means saying yes to the thing you’ve got to focus on. But that’s not what it means at all. It means saying no to the hundred other good ideas that there are. You have to pick carefully. I’m actually as proud of the things we haven’t done as the things I have done. Innovation is saying no to 1,000 things. - Biron Themes
Alternative blockquote style:
Code
Code can be presented inline, like <?php bloginfo('stylesheet_url'); ?>
, or within a <pre>
block. Because we have more specific typographic needs for code, we'll specify Consolas and Monaco ahead of the browser-defined monospace font.
Here are a few examples of code highlighting:
HTML code
CSS code
Javascript code
Inline code
and code
Diff code
Playground
Text-level semantics
Styling for common inline HTML5 elements.
The example
The b element example
The code element
example
The em element example
The sub element example
The sub element example
The u element example
The ins element example
The mark element example
The s element example
The details
element:
Tables
Table_Header_1 | Table_Header_2 | Table_Header_3 |
---|---|---|
单元格1 | 单元格2 | 单元格3 |
单元格4 | 单元格5 | 单元格6 |
Table_Header_1 | Table_Header_2 | Table_Header_3 | Table_Header_4 | Table_Header_5 | Table_Header_6 | Table_Header_7 |
---|---|---|---|---|---|---|
A | B | C | D | E | F | G |
H | I | J | K | L | M | N |
O | P | Q | R | S | T | U |
Tasks
- to do
- done