Start editing a spatial style sheet
A space style sheet is a good starting place for you to start customizing your edits to CSS. In the spatial style sheet, you have all the elements that you can modify. When you edit a spatial stylesheet, the changes to the spatial stylesheet are only valid for the space you have modified, and are applied to all spatial pages. Create some styles in the spatial style sheet, then test them, and when there are no problems, you can apply them to the entire site. You can then make more customizations to Confluence's CSS including adjusting the search page, the main panel, and some other overall pages.
Use the right tools
Confluence's CSS is also quite complex, and WEB development tools will help you understand how a page's style sheet is created. For some specific situations, you may want to see the source code that the page already exists on. Some of the free tools below will help you debug and view your source code. H as the following free applications would allow you to do this.
1. Firebug
Firebug, is a plugin for Firefox browser. This plugin allows you to view the style sheets of the elements in your page. This tool is useful for parsing the stylesheet of the current element, such as a style sheet that is applied only to the head.
2. Web Developer
Web Developer is a plugin for Firefox that allows you to edit and create a new design directly on the page.
3. CSS Edit
The CSS editor is a standalone editor that uses CSS for Macintosh system editing. This editor is able to get all of the current CSS stylesheets, and then allows you to re-edit the style sheets.
Start with simple elements
You can start editing from a few simple primitives and see how these changes work with these edits. When you make changes to the CSS, you should look at the effect for each modification, which will help you better analyze and solve the problem. Note that some page elements may be more suitable for editing than other pages. For example, adding a gradient to a page to a toolbar can make CSS work better than modifying the width of the entire page, without causing the page to break. Edit the appropriate static elements, such as a background image to more accurately represent the page in a drop-down menu rather than designing the entire program or using JavaScript (in fact, it is not recommended to make too many changes with JavaScript).
Https://www.cwiki.us/display/CONFLUENCEWIKI/Basic+Styling+Tutorial
Confluence 6 CSS Editing tips