Apply CSS

In addition to setting a component's attribute, we can also change a component's style by CSS (Cascading Style Sheet). There are two component attributes to apply CSS:

style attribute. Like the "style" attribute on an HTML element, you can directly write CSS rules as the attribute's value.
```
<label value="Chapter 1" style="font-weight: bold;"/>
```
sclass attribute. You should specify a CSS class name as the attribute value.
```
<div sclass="banner">
```

To apply a CSS class, you should define it first in a ZUL. There are 2 ways to declare a CSS class.

Inside <style> tag.

<zk>
 <style>
     .banner {
         background-color:#102d35;
         color: white;
         padding: 5px 10px;
     }
 </style>
 ...
</zk>

In an external CSS file and included by <?link ?> directive.

It can link to a external style sheet which can be applied to many pages. We use this way in the example to declare CSS.


<?link rel="stylesheet" type="text/css" href="/style.css"?>
<zk>
    ...
</zk>