...
A page or component (for example, a layout component) that is rendering the <head> tag can add a style sheet directly in the markup.
![]() Code Block |
|
|
<head>
<link href="" rel="stylesheet" type="text/css"/>
. . .
|
If you want to leverage Tapestry's localization support, you may want to make use of an expansion and the "asset:" or "context:" binding prefix:
![]() Code Block |
|
|
<head>
<link href="" rel="stylesheet" type="text/css"/>
. . .
|
...
Another approach to adding a style sheet is to include an @Import annotation (starting with Tapestry 5.2) on your component class:
![]() Code Block |
|
|
@Import(stylesheet="context:css/site.css")
public class MyComponent
{
}
|
...
For Tapestry 5.2 and later, if you need to load a different style sheet for Internet Explorer browsers, or for certain versions of IE browsers, you can use Tapestry's built-in support for IE conditional comments. Just add something like the following to your page or component (or layout) class:
![]() Code Block |
|
|
@Environmental
private _javascript_Support _javascript_Support;
@Inject @Path("context:layout/ie-only.css")
private Asset ieOnlyStylesheet;
// add an IE-only style sheet if browser is IE
void afterRender() {
_javascript_Support.importStylesheet(new StylesheetLink(ieOnlyStylesheet, new
StylesheetOptions(null, "IE")) );
}
|
The above will render something like:
![]() Code Block |
|
|
<!--[if IE]>
<link type="text/css" rel="stylesheet" href=""
<![endif]-->
|
...
Though it should be rarely needed, you can prevent Tapestry's default style sheet from loading by overriding the configuration in your application's module (normally AppModule.java):
![]() Code Block |
| java |
title |
AppModule.java (partial) |
|
|
@Contribute(MarkupRenderer.class)
public static void deactiveDefaultCSS(OrderedConfiguration<MarkupRendererFilter> configuration)
{
configuration.override("InjectDefaultStyleheet", null);
}
|
...
CSS 