Wiki source code of CSS Code Style
Last modified by Vincent Massol on 2024/11/19 16:15
Show last authors
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{error}} | ||
| 2 | Version 19.1 added to dev.xwiki.org: http://dev.xwiki.org/xwiki/bin/view/Community/XhtmlCssCodeStyle | ||
| 3 | {{/error}} | ||
| 4 | |||
| 5 | The following rules must be followed: | ||
| 6 | |||
| 7 | * the CSS must be valid conform [[CSS 2.1 specification>>http://www.w3.org/TR/CSS21/]]. This can be tested using the [[W3C validator>>http://jigsaw.w3.org/css-validator/]] | ||
| 8 | * don't use inline style declarations | ||
| 9 | * don't hard code colors in proprieties - use ColorTheme attributes | ||
| 10 | * test your code on at least 3 browsers (IE, FF, Safari) | ||
| 11 | |||
| 12 | The following recommendations could be followed: | ||
| 13 | |||
| 14 | * Proprieties: | ||
| 15 | ** alphabetical order; | ||
| 16 | ** 2 spaces indentation; | ||
| 17 | ** use of CSS shorthands; | ||
| 18 | ** use relative sizes (em, %) instead of fixed ones (px); | ||
| 19 | ** use appropriate CSS files for writing IE rules; | ||
| 20 | *** limit as much as possible the number of IE hacks used. | ||
| 21 | |||
| 22 | * Organization: | ||
| 23 | ** comment headers for separation and grouping of different parts of the code; | ||
| 24 | |||
| 25 | * Overwriting: | ||
| 26 | ** document the localization of the overwrite using "Overwrites" and "Should be in" comments; | ||
| 27 | |||
| 28 | {{warning}} | ||
| 29 | We currently don't have a naming convention | ||
| 30 | {{/warning}} | ||
| 31 | |||
| 32 | ==== Tools ==== | ||
| 33 | |||
| 34 | [[Firebug>>http://www.getfirebug.com/]] | ||
| 35 | |||
| 36 | [[CSS Optimizer>>http://www.cssoptimiser.com/]] and [[CSS Compressor>>http://www.csscompressor.com/]] are two excellent online tools that can shrink CSS. |