diff --git a/demo.html b/demo.html new file mode 100644 index 0000000..142a04c --- /dev/null +++ b/demo.html @@ -0,0 +1,297 @@ + + + + + + Normalize CSS + + + + + +
+
+

Grouped Heading 1

+

Grouped Heading 2

+
+ +
+ +

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+
Heading 5
+
Heading 6
+ +
+

Section Heading 1

+
+

Article Heading 2

+
Address: somewhere, world
+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+
+
+ +

Text-level semantics

+ +

+ The a element example
+ The abbr element example
+ The b element example
+ The cite element example
+ The code element example
+ The del element example
+ The dfn element example
+ The em element example
+ The i element example
+ The img element example
+ The ins element example
+ The kbd element example
+ The mark element example
+ The q element inside a q element example
+ The s element example
+ The samp element example
+ The small element example
+ The span element example
+ The strike element example
+ The strong element example
+ The sub element example
+ The sup element example
+ The var element example
+ The u element example +

+ +

Grouping content

+ +

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+ +

pre

+ +
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
+
<html>
+    <head>
+    </head>
+    <body>
+        <div class="main"> <div>
+    </body>
+</html>
+ +

blockquote

+ +
+

Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

+
+ +
Even better philosophical quote marked up with just a <blockquote> element.
+ +

ordered list

+ +
    +
  1. list item 1
  2. +
  3. list item 1 +
      +
    1. list item 2
    2. +
    3. list item 2 +
        +
      1. list item 3
      2. +
      3. list item 3
      4. +
      +
    4. +
    5. list item 2
    6. +
    7. list item 2
    8. +
    +
  4. +
  5. list item 1
  6. +
  7. list item 1
  8. +
+ +

unordered list

+ + + +

description list

+ +
+
Description name
+
Description value
+
Description name
+
Description value
+
Description value
+
Description name
+
Description name
+
Description value
+
+ +

figure

+ +
+ +
Figcaption content
+
+ +

Tabular data

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Jimi Hendrix - albums
AlbumYearPrice
AlbumYearPrice
Are You Experienced1967$10.00
Axis: Bold as Love1967$12.00
Electric Ladyland1968$10.00
Band of Gypsys1970$12.00
+ +

Forms

+ +
+
+ Inputs as descendents of labels (form legend) +

+

+

+

+

+

+

+ +

+

+

+

+ +

+

+
+ +
+ Inputs as siblings of labels +

+

+

+

+

+

+

+

+ +

+

+

+

+ +

+

+
+ +
+ Clickable inputs and buttons +

+

+

+

+ +

+

+

+
+ +
+ box-sizing tests +
+
+
+
+
+ +
+
+
+
+
+
+
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+
+ + + \ No newline at end of file diff --git a/index.html b/index.html index 335d033..03c29ad 100644 --- a/index.html +++ b/index.html @@ -1,85 +1,212 @@ - - + + + + + Normalize CSS : necolas/normalize.css @ GitHub + - + a:hover, + a:active { + outline: none; + } - - Fork me on GitHub + a:hover, + a:focus, + a:active { + text-decoration: underline; + color: #569107; + } + + strong { + font-weight: bold; + } + + pre { + display: block; + padding: 5px; + font-family: consolas, monospace, monospace; + font-size: 1em; + color: #fff; + background: #222; + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; + } + + ul { + list-style: square; + padding: 0; + margin: 1.4em 0; + } + + li { + margin: 0.35em 0; + } -
+ h1 { + margin: 0.5em 0; + font-size: 3.5em; + text-align: center; + } + + h2 { + margin: 1em 0 0.75em; + font-size: 1.5em; + } -
- - - - -
+ /* structure */ + + + .fork img { + position: absolute; + top: 0; + right: 0; + } -

normalize.css - by necolas

+ .demo { + margin:2em 0 4em; + text-align: center; + } + + .demo p { + margin: 0.5em 0 0; + font-style: italic; + } -
- normalize.css makes browsers render all elements consistently and in line with modern standards. -
+ .button { + display: inline-block; + padding: 6px 15px; + border: 1px solid #487310; + margin: 20px 0 0; + font-size: 22px; + line-height: 28px; + color: #fff; + background: #6EAD1A; + text-shadow:0 1px 1px rgba(0,0,0,0.4); + -moz-border-radius: 5px; + border-radius: 5px; + -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 20px rgba(255,255,255,0.25), + inset 0 -12px 25px rgba(0,0,0,0.3); + -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 20px rgba(255,255,255,0.25), + inset 0 -12px 25px rgba(0,0,0,0.3); + box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 10px rgba(255,255,255,0.25), + inset 0 -12px 25px rgba(0,0,0,0.3); + -webkit-transition: all 0.15s; + -moz-transition: all 0.15s; + -o-transition: all 0.15s; + transition: all 0.15s; + } -

Authors

-

necolas (nicolasgallagher@gmail.com)
Jonathan (jonathantneal@hotmail.com)

-

Contact

-

Nicolas Gallagher (nicolas@nicolasgallagher.com)

+ .button:hover, + .button:focus, + .button:active { + text-decoration: none; + color: #fff; + background: #569107; + } + + .footer { + border-top: 1px solid #ccc; + margin: 3em 0 0; + font-size: 13px; + } + + + + + + + Fork me on GitHub + -

Download

-

- You can download this project in either - zip or - tar formats. -

-

You can also clone the project with Git - by running: -

$ git clone git://github.com/necolas/normalize.css
-

+
- +

normalize.css

+ +

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards.

+ +

What does it do?

+ + + + +

How to use it

+

You are encouraged to read, edit, customise, add, and trim rulesets or styles from normalize.css on a per project basis.

+

The normalize.css file is not intended to be a mysterious "black box" that is included in a project and then ignored. It should be used as a customisable starting point on any project.

-
+

Browser support

+

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

- - - +

Source code

+

Get the source code on GitHub: necolas/normalize.css, or download it in either zip or tar formats.

+

You can also clone the project with Git by running:

$ git clone git://github.com/necolas/normalize.css

+ +

Acknowledgements

+

Normalize.css is a project by Jonathan Neal and Nicolas Gallagher. Our branches have diverged somewhat and I recommend that you also have a look at Jonathan's normalize.css branch.

+ + + +
+ + +