style"
m (correct highlight (via JWB)) |
|||
| (One intermediate revision by one other user not shown) | |||
| Line 9: | Line 9: | ||
It specifies an element that shall be generated inside the HEAD element. It is generated ''after'' ZK default JavaScript and CSS files. Thus, it could override what is defined in ZK default CSS code. Currently only HTML-based clients (so-called browsers) support it. Furthermore, HTML STYLE or LINK tags are actually generated for each of this declaration. | It specifies an element that shall be generated inside the HEAD element. It is generated ''after'' ZK default JavaScript and CSS files. Thus, it could override what is defined in ZK default CSS code. Currently only HTML-based clients (so-called browsers) support it. Furthermore, HTML STYLE or LINK tags are actually generated for each of this declaration. | ||
| − | Developers can specify whatever attributes you like; it is up to the browser to interpret. ZK only evaluates the <code>if</code> and <code>unless</code> attributes, and encodes the URI of the < | + | Developers can specify whatever attributes you like; it is up to the browser to interpret. ZK only evaluates the <code>if</code> and <code>unless</code> attributes, and encodes the URI of the <code>href</code> and <code>src</code> attribute (by use of <javadoc method="encodeURL(java.lang.String)">org.zkoss.zk.ui.Execution</javadoc>). ZK generates all other attributes directly to the client. |
| − | Notice that these header directives are effective only for the main ZUL page. In other words, they are ignored if a page is included by another pages or servlets. Also, they are ignored if the page is a < | + | Notice that these header directives are effective only for the main ZUL page. In other words, they are ignored if a page is included by another pages or servlets. Also, they are ignored if the page is a <code>zhtml</code> file. |
| − | < | + | <syntaxhighlight line lang="xml" > |
<?style src="/css/foo.css"?> | <?style src="/css/foo.css"?> | ||
<?style content=" | <?style content=" | ||
| Line 22: | Line 22: | ||
My content | My content | ||
</div> | </div> | ||
| − | </ | + | </syntaxhighlight> |
As shown above, the attribute value could span multiple lines. | As shown above, the attribute value could span multiple lines. | ||
Latest revision as of 13:28, 19 January 2022
Syntax:
<?style [type="text/css"] [src="uri"] [charset="encoding"] [content="css snippet"] [if="..."] [unless="..."]?>
Since 5.0.8
It specifies an element that shall be generated inside the HEAD element. It is generated after ZK default JavaScript and CSS files. Thus, it could override what is defined in ZK default CSS code. Currently only HTML-based clients (so-called browsers) support it. Furthermore, HTML STYLE or LINK tags are actually generated for each of this declaration.
Developers can specify whatever attributes you like; it is up to the browser to interpret. ZK only evaluates the if and unless attributes, and encodes the URI of the href and src attribute (by use of Execution.encodeURL(String)). ZK generates all other attributes directly to the client.
Notice that these header directives are effective only for the main ZUL page. In other words, they are ignored if a page is included by another pages or servlets. Also, they are ignored if the page is a zhtml file.
1 <?style src="/css/foo.css"?>
2 <?style content="
3 div.blue {background: blue}
4 "?>
5
6 <div sclass="blue">
7 My content
8 </div>
As shown above, the attribute value could span multiple lines.
Alternatives
Alternatively, you could use the style component to embed CSS code. Using the style component if you'd like to add or remove the style dynamically (since it is a component), or the page will be included by others.
Version History
| Version | Date | Content |
|---|---|---|
| 5.0.8 | July, 2011 | The style directive was introduced. |