Bootstrap"
From Documentation
| Line 9: | Line 9: | ||
See the integration example: [https://github.com/zkoss-demo/admin-template admin template] | See the integration example: [https://github.com/zkoss-demo/admin-template admin template] | ||
| − | = Include | + | = Include JAR = |
To avoid downloading bootstrap manually, it's convenient to include it by [https://www.webjars.org/ WebJars] with Maven. | To avoid downloading bootstrap manually, it's convenient to include it by [https://www.webjars.org/ WebJars] with Maven. | ||
| Line 19: | Line 19: | ||
</dependency> | </dependency> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | |||
= Include CSS = | = Include CSS = | ||
Latest revision as of 08:35, 29 March 2023
Bootstrap is a very popular front-end framework for building responsive, mobile-first sites. It can be a good companion for ZK with the following usages:
- Layout a page with the responsive grid system
- Style a page with utility CSS classes
See the integration example: admin template
Include JAR
To avoid downloading bootstrap manually, it's convenient to include it by WebJars with Maven.
<dependency>
<groupId>org.webjars</groupId>
<artifactId>bootstrap</artifactId>
<version>4.6.0</version>
</dependency>
Include CSS
Page Scope
<?link rel="stylesheet" href="/webjars/bootstrap/4.6.0/css/bootstrap.min.css"?>
Application Scope
<?xml version="1.0" encoding="UTF-8"?>
<language-addon>
<addon-name>bootstrap</addon-name>
<language-name>xul/html</language-name>
<stylesheet href="/webjars/bootstrap/4.6.0/css/bootstrap.min.css" type="text/css"/>
</language-addon>
See ZK Client-side Reference/Language Definition/stylesheet