Bootstrap"
From Documentation
Line 22: | Line 22: | ||
= Include CSS = | = Include CSS = | ||
+ | ==Page Scope== | ||
+ | <syntaxhighlight lang='xml'> | ||
+ | <?link rel="stylesheet" href="/webjars/bootstrap/4.6.0/css/bootstrap.min.css"?> | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | ==Application Scope== | ||
<syntaxhighlight lang='xml'> | <syntaxhighlight lang='xml'> | ||
− | <? | + | <?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> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
+ | See [[ZK%20Client-side%20Reference/Language%20Definition/stylesheet]] | ||
{{ZKDevelopersReferencePageFooter}} | {{ZKDevelopersReferencePageFooter}} |
Revision as of 08:34, 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 Bootstrap
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