Difference between revisions of "CSS example"

From Organic Design wiki
(new way)
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{#css:spots.css}}
+
{{#tag:html|<style>{{:spots.css}}</style>}}
 
<big><b><br><br><br><br>
 
<big><b><br><br><br><br>
This is an example of adding a CSS article to a page using [[MW:Extension:CSS|Extension:CSS]]. The CSS article in this example is the [[spots.css]] article which is attached to this page using  
+
This is an example of adding a CSS article to a page using HTML syntax. The CSS article in this example is the [[spots.css]] article which is attached to this page using  
<tt><nowiki>{{#css:spots.css}}</nowiki></tt>. The [[spots.css]] article contains the following CSS content:
+
<tt><nowiki>{{#tag:html|<style>{{:spots.css}}</style>}}</nowiki></tt>.
</b></big>
+
 
<css>
 
{{:spots.css}}
 
</css>
 
 
You can also do inline CSS styles like this
 
You can also do inline CSS styles like this
<css>
+
<pre>
{{#css:
+
{{#tag:html|<style>
     body { line-height: 150% }
+
     body p { line-height: 150% }
}}
+
     pre { font-size: 200%; color: green; }
</css>
+
</style>}}
{{#css:
+
</pre>
     body { line-height: 150% }
 
}}
 
  
 
[[Category:Examples]]
 
[[Category:Examples]]

Latest revision as of 08:21, 10 April 2016





This is an example of adding a CSS article to a page using HTML syntax. The CSS article in this example is the spots.css article which is attached to this page using {{#tag:html|<style>{{:spots.css}}</style>}}.

You can also do inline CSS styles like this

{{#tag:html|<style>
    body p { line-height: 150% }
    pre { font-size: 200%; color: green; }
</style>}}