Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
I've reached a point where I need to change the look of ZK. I'm looking at CSS and I don't get how to apply the style guide. I've got a simple window with two buttons and I'm trying to change the look.
I was looking through the button CSS source and found the z-button class. This appears to work. I also saw another post on the forum that used this approach. I'm wondering if this is the right way to do things. My first time touching CSS, I get how it works, I just need to know how to apply it to ZK.
<window border="normal" width="300px" height="200px">
<style>
.z-button .z-button-cr, .z-button .z-button-bl, .z-button .z-button-bm
{
background-image:none;
}
</style>
<vbox width="100%">
<window height="150px" border="normal"/>
<hbox>
<button label="Test" sclass="button"/>
<button label="Test 2"/>
</hbox>
</vbox>
</window>
try this
<style>
.z-button .z-button-cr,.z-button .z-button-cl, .z-button .z-button-cm,
.z-button .z-button-bl, .z-button .z-button-bm,.z-button .z-button-br,
.z-button .z-button-tl, .z-button .z-button-tm,.z-button .z-button-tr {
background-image:none;
background-color:#008bb6;
color:white
}
.button2 .z-button-cm {
color:red
}
</style>
<vbox width="100%">
<window height="150px" border="normal"/>
<hbox>
<button label="Test" sclass="button2"/>
<button label="Test 2"/>
</hbox>
</vbox>
</window>you will get two different button
and you can make your own :D
Asked: 2008-10-21 22:59:03 +0800
Seen: 229 times
Last updated: Oct 22 '08