open stylesheet standard

Embed the stylesheet




Download the latest version

Version 1.1.1
August 22th 2013





Show documentation

What is Orange CSS?

Orange CSS is a basic stylesheet blueprint. It can be very useful when you just want to make a HTML file and need a little style, so your page doesn't look so awful.

Commands


Boxes

Explanation:

The info box shows a green box with an info icon on the left side. Your content appears next to the icon.

The error box shows a red box with an error icon on the left side.

The blue box shows a blue box with an info icon on the left side.

The ask box shows a blue box with an question icon on the left side.

Possible tags:

This may look like this:

Here stands your text.

Here stands your text.

Here stands your text.

Here stands your text.


By default the width is 100%. But you can also set a fixed size:

<div class="info-box" style="width: 300px;">Here stands your text.</div>
Here stands your text.

Button

Explanation:

Shows a button which reacts on mouse over and on click. Can use for example as submit button for forms.

Possible tags:

This may look like this:


Container

Explanation:

A div container with width of 800 pixels, margin auto and margin-top of 100px.

Possible tags:


Align left

Explanation:

With align left you can fix an object on the left side and let for example a text flow around it.

Possible tags:

Example:

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Align right

Explanation:

With align left you can fix an object on the right side and let for example a text flow around it.

Possible tags:

Example:

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Clear both

Explanation:

Contains the CSS definition clear: both;.

Possible tags:


Of course all other HTML commands are also allowed.



LGK Orange is by a German guy. So English isn't my native language.

If you find weird sentences, please report me.

© 2013 LGK - Contact