APG_STYLE: Sample page for CSS test

Version française

This page will display most of the HTML tags as transformed by the CSS you indicate: an easy and fast way to test your CSS. On a technical level, it is a listing of the commons HTML tags, mostly based on theTivoli Sample Page, completed and converted into PHP Form to allow a direct interaction.

How to use it:

If you leave everything blank: the default text will be displayed following the default CSS of your browser

External URL: You can indicate up to 4 external CSS files, they are inserted (link rel) following this order

CSS code: code pasted here is inserted in the header of the page inside <style></style>

Advanced:

Yahoo! reset: If checked, the Yahoo! standard CSS reset is applied before insertion of other CSS

Complete reset: Same as Yahoo! reset, with more selectors resetted

Div ID (#): If the CSS code you want to test is defined in an ID (e.g.: #header), indicate it here

Div Name (class): If the CSS code you want to test is defined in a class (e.g.: .header), indicate it here

Text:You can change the text displayed in paragraphs

Important: There is NO recuperation of data (of course IP is logged all its way to the server, but your CSS is NOT copied).

In case of difficulty/bug/crash/undocumented feature: please use this form to contact me

Thanks, Philippe Gouillou
www.gouillou.com

PS: The following ads are promised be so precisely automagically targeted that they should interest you:

External URL of CSS file(s)

1st file:
2nd file:
3rd file:
4th file:

CSS code:

Without <style> </style>

Advanced:

Yahoo! reset:
Complete reset:

Div ID (#):
Div Name (Class):

Displayed Text:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus urna. Morbi pulvinar nunc et nunc. Cras sed libero a elit feugiat hendrerit. Nulla magna dui, viverra ac, blandit sit amet, mollis non, lorem. Nullam commodo, arcu accumsan lobortis vulputate, ante lacus pretium orci, et congue orci orci sit amet odio. Quisque dolor. Morbi elementum hendrerit nisi. Nulla mi sapien, porta eu, ornare in, auctor ut, nisi. Nunc vel erat. Duis sed nisl quis dolor interdum pretium. Cras molestie, felis sit amet viverra placerat, risus turpis mollis risus, non blandit eros mi eu lacus. Mauris tempor metus non erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam nec ligula. Ut aliquet elit cursus urna rutrum pretium. Fusce diam neque, volutpat ut, aliquam nec, ultricies eu, nunc. Vestibulum hendrerit purus ac est. Cras pulvinar erat ac est. Suspendisse tortor.

Linked image with Title Attribute:

Level 1 heading

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus urna. Morbi pulvinar nunc et nunc. Cras sed libero a elit feugiat hendrerit. Nulla magna dui, viverra ac, blandit sit amet, mollis non, lorem. Nullam commodo, arcu accumsan lobortis vulputate, ante lacus pretium orci, et congue orci orci sit amet odio. Quisque dolor. Morbi elementum hendrerit nisi. Nulla mi sapien, porta eu, ornare in, auctor ut, nisi. Nunc vel erat. Duis sed nisl quis dolor interdum pretium. Cras molestie, felis sit amet viverra placerat, risus turpis mollis risus, non blandit eros mi eu lacus. Mauris tempor metus non erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam nec ligula. Ut aliquet elit cursus urna rutrum pretium. Fusce diam neque, volutpat ut, aliquam nec, ultricies eu, nunc. Vestibulum hendrerit purus ac est. Cras pulvinar erat ac est. Suspendisse tortor.

Level 02 Heading

Level 03 Heading

Level 04 Heading

Level 05 Heading

Level 06 Heading

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus urna. Morbi pulvinar nunc et nunc. Cras sed libero a elit feugiat hendrerit. Nulla magna dui, viverra ac, blandit sit amet, mollis non, lorem. Nullam commodo, arcu accumsan lobortis vulputate, ante lacus pretium orci, et congue orci orci sit amet odio. Quisque dolor. Morbi elementum hendrerit nisi. Nulla mi sapien, porta eu, ornare in, auctor ut, nisi. Nunc vel erat. Duis sed nisl quis dolor interdum pretium. Cras molestie, felis sit amet viverra placerat, risus turpis mollis risus, non blandit eros mi eu lacus. Mauris tempor metus non erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam nec ligula. Ut aliquet elit cursus urna rutrum pretium. Fusce diam neque, volutpat ut, aliquam nec, ultricies eu, nunc. Vestibulum hendrerit purus ac est. Cras pulvinar erat ac est. Suspendisse tortor.

Address: Example address 224, Sweden

Preformated:Testing one row
            and another

I am a not visited Link example (link to an inexistant page)
I am a visited Link example (link to this page)
I am the abbr tag example
I am the acronym tag example
I am the b tag example
I am the big tag example
I am the cite tag example
I am the code tag example
I am ~~the del tag~~ example
I am the dfn tag example
I am the em tag example
I am the font tag example (verdana)
I am the i tag example
I am the ins tag example
I am the kbd tag example
I am the q tag inside a q tag example
I am ~~the s tag~~ example
I am the samp tag example
I am the small tag example
I am the span tag example
I am ~~the strike tag~~ example
I am the strong tag example
I am _{the sub tag} example
I am ^{the sup tag} example
I am the tt tag example
I am the var tag example
I am the u tag example

Unordered list 01
Unordered list 02
Unordered list 03
- Unordered list inside list level 2
- Unordered list inside list level 2
  - Unordered list inside list level 3
  - Unordered list inside list level 3

Ordered list 01
Ordered list 02
Ordered list 03
1. Ordered list inside list level 2
2. Ordered list inside list level 2
  1. Ordered list inside list level 3
  2. Ordered list inside list level 3

Description list title 01: Description list description 01
Description list title 02: Description list description 02; Description list description 03

Table Caption
Table head th	Table head td
Table foot th	Table foot td
Table body th	Table body td
Table body td	Table body td