springboot使用thymeleaf如何引用公共部分html

//下面的例子只供参考，并无写完整的例子，给出了关键部分

//使用 th:fragment="topbar" 来把工公共部分抽取处理

<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0" th:fragment="topbar"> </li> </ul> </nav>

//在别的页面引入公共片断common/bar表明common目录下的bar.html（抽取的公共页面）topbar表明从bar.html抽取的片断

<div th:replace="common/bar::topbar"></div>

//引入片断有三种方式 建议使用第2种方式

<div th:insert="footer :: copy"></div>

<div th:replace="footer :: copy"></div>

<div th:include="footer :: copy"></div>

//下面表明上面的三种方式，对比就能看出区别

<div>

<footer>

© 2011 The Good Thymes Virtual Grocery

</footer>

</div>

<footer>

© 2011 The Good Thymes Virtual Grocery

</footer>

<div>

© 2011 The Good Thymes Virtual Grocery

</div>

//下面是讲的是frament表达式的使用，为了让某个在css在某个页面才能起做用

// 使用 th:class="${activeUri=='main.html'?'nav-link active':'nav-link'}"改变在不一样的请求下，class有不一样的css

//下面例子表示在{你的项目的相关路径}/main.html的请求下，a标签下的class="nav-link active",若是不是class="nav-link"

<a class="nav-link active"

th:class="${activeUri=='main.html'?'nav-link active':'nav-link'}"
 
 href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">

<div class="row">

<div th:replace="common/bar::#leftbar(activeUri='main.html')"></div>