Theming and Styling"

From Documentation
m
m
Line 11: Line 11:
 
*:If you allow users to have different theme they prefer, you could implement a theme provider to allow them to switch among the themes you provide.
 
*:If you allow users to have different theme they prefer, you could implement a theme provider to allow them to switch among the themes you provide.
  
 +
{{ZKDevelopersReferenceHeadingToc}}
  
{{ZKDevelopersReferenceHeadingToc}}
+
The CSS styling really depends on the implementation of the component (and the mold). It is suggested to refer to [[ZK Style Guide]]. In additions, if you have any doubt, you could use the HTML or CSS inspector shipped with the browser, such as [http://getfirebug.com/ Firebug] for Firefox, and [http://en.wikipedia.org/wiki/Internet_Explorer_Developer_Toolbar Developer Tools] for Internet Explorer, to investigate how CSS styles are used.
 
{{ZKDevelopersReferencePageFooter}}
 
{{ZKDevelopersReferencePageFooter}}

Revision as of 10:11, 29 November 2010


Theming and Styling


Depending on the requirement, there are different ways to customize the look and feel of components.

  • Molds
    A component could have multiple different appearance, such as accordion vs regular tabbox. Each appearance is called a mold. You could choose one fulfilling your need.
  • CSS
    To fine-tune the look and feel of a particular component, you could specify CSS styles and classes without changing the DOM structure at the client.
  • Theme Customization
    The default themes (breeze, classic blue.. provided by ZK) allows some generic customization, such as font size. In additions, you could customize CSS and also DOM structures.
  • Theme Provider
    If you allow users to have different theme they prefer, you could implement a theme provider to allow them to switch among the themes you provide.



The CSS styling really depends on the implementation of the component (and the mold). It is suggested to refer to ZK Style Guide. In additions, if you have any doubt, you could use the HTML or CSS inspector shipped with the browser, such as Firebug for Firefox, and Developer Tools for Internet Explorer, to investigate how CSS styles are used.


Last Update : 2010/11/29

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.