Difference between revisions of "CSS example"

From Organic Design wiki
Line 8: Line 8:
 
</css>
 
</css>
 
You can also do inline CSS styles like this
 
You can also do inline CSS styles like this
<css>
+
<pre>
 
{{#css:
 
{{#css:
     body { line-height: 150% }
+
     body p { line-height: 150% }
 +
    pre { font-size: 200%; color: green; }
 
}}
 
}}
</css>
+
</pre>
 
{{#css:
 
{{#css:
     body { line-height: 150% }
+
     body p { line-height: 150% }
 +
    pre { font-size: 200%; color: green; }
 
}}
 
}}
  
 
[[Category:Examples]]
 
[[Category:Examples]]

Revision as of 00:51, 5 August 2008

{{#css:spots.css}}



This is an example of adding a CSS article to a page using Extension:CSS. The CSS article in this example is the spots.css article which is attached to this page using {{#css:spots.css}}. The spots.css article contains the following CSS content:
<css>

/* Example CSS */

body {
    background: url('/files/9/9d/Fliss-dots.jpg');
    background-color: #A9D5F8;
    }

#p-cactions li a { background-color: #F37FC6; color: #4EF337 }

#column-one, .footer, .firstHeading, #catlinks { display:none }

#content { padding:0; margin:5em }

#content p, pre.css { font-size:200%; font-weight:bold; line-height:200% }

</css> You can also do inline CSS styles like this

{{#css:
    body p { line-height: 150% }
    pre { font-size: 200%; color: green; }
}}

{{#css:

   body p { line-height: 150% }
   pre { font-size: 200%; color: green; }

}}