我使用Spring Initializr使用嵌入式Tomcat + Thymeleaf模板引擎生成了Spring Boot Web应用程序。 我有这个Thymeleaf模板
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<body>
<div th:fragment="common-navbar" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a th:text="#{navbar.home.text}" href="/"></a></li>
<li><a th:text="#{navbar.about.text}" href="/about"></a></li>
<li><a th:text="#{navbar.contact.text}" href="/contact"></a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li th:if="${#authorization.expression('!isAuthenticated()')}">
<a th:href="@{/login}" th:text="#{navbar.login.text}" />
</li>
<li th:if="${#authorization.expression('isAuthenticated()')}">
<form id="f" th:action="@{/logout}" method="post" role="form" class="navbar-form">
<button type="submit" th:text="#{navbar.logout.text}" class="btn btn-primary" />
</form>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</body>
</html>
但我有2个警告No end tag (</a>)
。 &安培; No end tag (</button>)
。
答案 0 :(得分:0)
Thymeleaf阻止呈现无效的HTML。根据HTML5标准,使用自我封闭的<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="container">
<h2 class="text-center">Lightbox Gallery</h2>
<div class="lightbox-gallery">
<div>
<img src="http://placehold.it/300/f1b702/fff&text=image1" alt="">
<div class="js-text text">Test 1</div>
</div>
<div><img src="http://placehold.it/300/d2f1b2/222&text=image2" alt="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime accusamus officiis dignissimos doloribus consectetur harum eos sapiente optio aut minima."><div class="js-text text">Test 2</div></div>
<div><img src="http://placehold.it/300/eee/000&text=image3" alt="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates veritatis similique, amet, maiores soluta recusandae cupiditate, sed perspiciatis fugit minima, sunt dolores cum earum deserunt illo ipsum!"><div class="js-text text">Test 3</div></div>
<div><img src="http://placehold.it/300/222/fff&text=image4" alt="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque laudantium dignissimos tenetur eos unde quidem repellat officiis nemo laboriosam necessitatibus deleniti commodi quis aliquid est atque tempora aut, nihil!"><div class="js-text text">Test</div></div>
<div><img src="http://placehold.it/300/b47f99/000&text=image5" alt="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto minus consequatur soluta quaerat itaque, laboriosam quis a facilis, cumque, deleniti quas aperiam voluptate dolore. Enim nostrum sit eaque, porro eligendi illo placeat?"><div class="js-text text">Test</div></div>
<div><img src="http://placehold.it/300/e1d400/000&text=image6" alt="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi suscipit quam, id aliquam totam aperiam quas rem debitis voluptatem pariatur, illo accusamus facilis eius ipsa! Reprehenderit libero, quas iste repudiandae distinctio, quos dignissimos."><div class="js-text text">Test</div></div>
</div>
</div>
和a
标记,您正在做的事情无效。
您可以在W3验证器页面上检查HTML代码的验证:https://validator.w3.org
尝试使用自封的button
和a
标记的HTML代码,然后查看结果。
但是,对于HTML代码的验证,Thymeleaf并不是那么强硬。
您看到W3表示button
元素上缺少title
属性是错误的。但百里香叶并没有给出错误。
尽管如此;对于Thymeleaf来说,重要的是您的HTML代码在需要时不应缺少封闭标记。
答案 1 :(得分:0)
如果您使用spring-boot-starter-thymeleaf
依赖项,则应添加
<properties>
<thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
<thymeleaf-layout-dialect.version>2.1.1</thymeleaf-layout-dialect.version>
</properties>
到pom.xml
。
这迫使maven使用Thymeleaf 3.默认的Thymeleaf 2不支持纯HTML5。