Cecilia Classless

Classless stylesheet for HTML.

This is a demo of Cecilia Classless, using the default styles.


Download
 
View on GitHub


Headings

<h1>

Heading 1

<h2>

Heading 2

<h3>

Heading 3

<h4>

Heading 4

<h5>

Heading 5

<h6>

Heading 6
 
<h1>...</h1>


Small text

<small>

Display heading with small text

Display paragraph with small text

 
<p><small>...</small></p>


Marked text

<mark>

This is a marked text and indicates a highlight.
 
<p>...<mark>...</mark>...</p>


Horizontal rules

<hr>

 
<hr>


Lists

<ol>

  1. Ordered list item 1
  2. Ordered list item 2
    • Nested ordered list item 1
    • Nested ordered list item 2

<ul>

  • Unordered list item 1
  • Unordered list item 2
    • Nested unordered list item 1
    • Nested unordered list item 2
 
<ul>...</ul>


Blockquotes

<blockquote> and <cite>

Those who pass by us, do not go alone, and do not leave us alone; they leave a bit of themselves, and take a little of us. Antoine de Saint-Exupéry
 
<blockquote>...<cite>...</cite></blockquote>


Code

<code>

For inline code, you can wrap a fragment of computer code in a <code> tag.

<pre> and <code>

For multiple lines of code, you can use the <code> tag inside a <pre> tag: 
<p>I'm a sample paragraph...</p>
<p>I'm another sample paragraph...</p>
 
<p>...<code>...</code>...</p>


Keyboard

<kbd>

Press Ctrl C to copy text.
 
<p>...<kbd>...</kbd>...</p>


Sample

<samp>

I'm a sample output from a computer program.
 
<samp>...</samp>


Tables

<table>

# Quantity Ingredient
1 3 Carrots
2 8 Strawberries
3 1 Lime
 
<table>...</table>


Forms

<input> and <select>

 
<input id="..." type="text" placeholder="...">