ZK Class Concept

ZK Class concept was introduced in ZK 3.6.0 version, it is a naming pattern, it appends some regular patterns for client action (please refer to the next section) , like click, focus, mouse-over, mouse-out, and so on.

ZK Class is also used for changing mold of components, and can be used to separate the two same components with different theme without any conflict. For example, there is a Button component and its ZK Class is called “z-button”, when user mouse is over the button, the ZK Class of the component will be appended with “-over” by ZK client engine, then the full ZK Class will be “z-button-over” so that we can easily customize a specific component theme for special purpose.

There are three different ways to change the style of ZK components as follows. The figure 1 shows where the Sclass and Zclass should be located, the red box means the Sclass will be appended to the root DOM tree of the component, and the green box means the Zclass will be treated as a prefix temp.