Wiki source code of CSS Code Style
Last modified by Vincent Massol on 2024/02/26 17:57
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. |