thymeleaf模板的标签使用&bootstrap

一、thymeleaf模板配置

#thymeleaf基础配置

#开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
spring.thymeleaf.mode=HTML5
#前缀
spring.thymeleaf.prefix=classpath:/templates/
#编码
spring.thymeleaf.encoding=UTF-8
#类型
spring.thymeleaf.servlet.content-type=text/html
#名称的后缀
spring.thymeleaf.suffix=.html

二、标签的应用

1. th:text

   <span th:text="${nowTime}"></span>
   

2. th:value和th:selected

   <select>
   	<option 
   		th:value="${text}" 
   		th:selected="${city.city_code eq cityId}">
   	</option>
   </select>
   

3. th:each
   循环遍历集合

   <div th:each="info : ${list}">
   	<span th:text="${info.text}"></span>
   </div>
   

4. th:if

    gt：great than（大于）>
    ge：great equal（大于等于）>=
    eq：equal（等于）==
    lt：less than（小于）<
    le：less equal（小于等于）<=
    ne：not equal（不等于）!=
   

   做判断，如果等于1，则显示“你好”

   <div th:if="${info} eq '1'">
   	<span>你好</span>
   </div>
   

三、bootstrap的样式地址和css地址

<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<meta name="viewport" content="width=device-width, initial-scale=1,shrink-to-fit=no">

<link rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
          crossorigin="anonymous">
          
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
        integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
        crossorigin="anonymous"></script>
<script
        src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
        integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh"
        crossorigin="anonymous"></script>
<script
        src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"
        integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ"
        crossorigin="anonymous"></script>