Installation
package manager
pnpm add atra.css
CDN
https://unpkg.com/atra.css@latest/dist/atra.min.css
Example
Text
Heading
heading 1
heading 2
heading 3
heading 4
heading 5
heading 6
Paragraph
The <p> HTML element represents a paragraph. Paragraphs are usually represented in visual media
as blocks of text separated from adjacent blocks by blank lines and/or first-line indentation, but HTML paragraphs
can be any structural grouping of related content, such as images or form fields.
List
- unordered list
- unordered list
- unordered list
- ordered list
- ordered list
- ordered list
Blockquote
Our mission is to make cloud computing accessible to everyone.
Code Block
pnpm add atra.css
Description
- Noa Ikushio
- She belongs to Millennium Science School and is the secretary of the student council &ldquot;Seminar”.
- Yuka Hayase
- She belongs to Millennium Science School and is the treasurer of the student council &ldquot;Seminar”.
- Koyuki Kurosaki
- She belongs to Millennium Science School and is a troublemaker and genius girl in the student council &ldquot;Seminar”.
Horizontal Rule
This is the first paragraph of text.
This is the second paragraph of text.
Inline
This is anchor link
Several species of salamander inhabit the temperate rainforest of the Pacific Northwest.
You could use this element to highlight speling mistakes, so the writer can corect them.
This line of text is meant to be treated as fine print.
... the most important rule, the rule you can never forget, no matter how much he cries, no matter how much he
begs:
never feed him after midnight.
Get out of bed now!
You can use CSS to style your
HTML.
Keyboard not found, Press F1 to continue
Please press Ctrl + Shift + R to re-render an MDN page.
Run
pnpm add atra.css to install.
Form
Button
Input
Checkbox
Radio
Textarea
Select
Fieldset and Legend
Image
Basic
figure + figcaption
Flow Content
Table
| The table header | |
|---|---|
| The table body | with two columns |
Details
Summary
Paragraph