This page (revision-3) was last changed on 13-Jan-2014 06:55 by IchiroFurusato 

This page was created on 12-Jan-2014 22:45 by Ichiro Furusato

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Version Date Modified Size Author Changes ... Change note
3 13-Jan-2014 06:55 2 KB IchiroFurusato to previous improved CSS example
2 13-Jan-2014 06:35 2 KB IchiroFurusato to previous | to last updated example
1 12-Jan-2014 22:45 1 KB Ichiro Furusato to last copied from local source
Incoming links Outgoing links
CascadingStylesheets
CascadingStylesheets

Difference between version and

At line 10 added one line
!! Example
At line 11 changed one line
CSS is at its most basic rather simple, composed of a ''selector'' and ''assigned style properties''. For example, the following styles all paragraphs with a 'class' attribute containing the value "hilight" to having a left margin of 16 pixels and a red font color:
A CSS stylesheet is a text (human-readable) document composed from one or more CSS ''rules''. A CSS rule is at its most basic rather simple, composed of a ''selector'' and one or more ''assigned style properties''. For example, the following rule styles all HTML paragraphs with a 'class' attribute containing the value "hilight" (i.e., "{{<p class='hilight'>Outside of a dog...</p>}}") to having a left margin of 16 pixels and a 'MidnightBlue' font color. Colors in HTML can be specified various ways, either as [HTML Colour Names] such as "MidnightBlue", RGB ("{{rgb(25,25,112)}}") or hexadecimal ("{{#191970}}") values. Because only a few color names are reliably supported by all browsers it is safer to use an RGB or hexadecimal value.
At line 13 changed one line
p.hilight { margin-left: 16px ; color : red }
p.hilight { margin-left: 16px ; color : #191970 }
At line 16 changed one line
where the selector is {{p.hilight}}, the assigned properties of {{margin-left: 16px}} and {{color : red}}.
where the selector is "{{p.hilight}}", the assigned properties of "{{margin-left: 16px}}" and "{{color : #191970}}".
At line 19 added 6 lines
JSPWiki permits direct input of CSS styles using [wiki markup]. The above example can be accomplished directly on a [wiki page] using the following markup:
{{{
%%(margin-left: 16px ; color : #191970)
Outside of a dog, a book is a man's best friend. Inside of a dog it's too dark to read. &mdash; Groucho Marx
%%
}}}
At line 26 added 7 lines
This would appear as:
%%(margin-left: 16px ; color : MidnightBlue)
Outside of a dog, a book is a man's best friend. Inside of a dog it's too dark to read. &mdash; Groucho Marx
%%
This page (revision-3) was last changed on 13-Jan-2014 06:55 by IchiroFurusato  Top