CSS Basic Elements

The purpose of this HTML is to help determine what default settings are with CSS.

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Set width of text emphasis using available classes: width100, width75, width50, width25 or by pixel inline style.

Large Black on Gold

Large Gold on Gray

Small Gold on Gold

Small Black on Gray

Gold Diagonals Offset

Gray Diagonals Offset

Solid Gray with Gray Bottom Border

Gold Bottom Border

Paragraph, Links

Class "underline"

Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.

Indented Paragraph

Lorem ipsum dolor sit amet, emphasis consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.

Normal Link

Red Link

Black Link

Header Link

Footer Link

Footer Link Gold

List Types

Definition List

Definition List Title: This is a definition list division.

Ordered List

List Item 1
List Item 2
List Item 3

Unordered List

List Item 1

Test
Test
Test

List Item 3

Fieldsets, Legends, and Form Elements

Fieldset Legend

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.

Example Form

Text Field

Inline Help Text

Text Area

Help text block area for use when a lot of explanatory text is needed.

Password Field

Check Boxes

Checkbox 1 Checkbox 1Checkbox 1Checkbox 1Checkbox 1 Checkbox 2 Checkbox 3

Radio Buttons

Option one is this and that—be sure to include why it's great Option two can be something else and selecting it will deselect option one

Select Box

Date Picker

Phone Number

(999) 999-9999

File Upload

Tables

Table Header 1	Table Header 2	Table Header 3
Footer 1	Footer 2	Footer 3
Division 1	Division 2	Division 3
Division 1	Division 2	Division 3
Division 1	Division 2	Division 3

Misc Stuff - abbr, acronym, pre, code, sub, sup, etc.

Lorem ^superscript dolor _subscript amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. cite. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. NBA Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. AVE

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. NBA Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.  AVE

This stylesheet is for a blockquote.

-Blockquote

Images

Use class="imageBorder" for the gray border, and class="floatRight, floatLeft" for floats.