Springboot 引入css和js

標題:使用Springboot引入css和js 之前一直使用springboot+mvc+jsp 實現簡單的增刪改查. 使用jsp 引入bootstrap樣式沒有什么大的問題

  <link href="${pageContext.request.contextPath}/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <script href="${pageContext.request.contextPath}/bootstrap/js/bootstrap.js"></script>

源樣式存放在resource下的static文件下可正常使用

這幾天使用新的框架去寫的時候就出了新的bug
使用Springboot+thymeleaf+bootstarp寫的時候一直在導入css上面出了bug.

找不到css 和js習慣下的查看下配置文件
第一個bug 是沒有加上配置文件的約束
'''
server:
port: 8080
spring:
mvc:
static-path-pattern: /static/**
thymeleaf:
#緩沖的配置
cache: false
datasource:
name:
url: jdbc:mysql://127.0.0.1:3306/bank_project?useUnicode=true&characterEncoding=UTF-8&allowMultiQueries=true&serverTimezone=UTC
username: root
password: root
web:
resources:
static-locations: classpath:/static/

mybatis:
mapper-locations: classpath:mapper/*.xml

'''
Springboot2.0+需要配置下靜態資源,如果不在需要修改
之后再修改導入的設置
更改為
'''

<!--    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">-->
<!--    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>-->

'''
直接使用cdn來寫就不會找不到,如果配置在本地的話就需要
'''

<link rel="stylesheet" type="text/css" media="all" href="/static/css/bootstrap.css"
      th:href="@{/static/css/bootstrap.css}"/>
<script type="text/javascript" src="/static/js/bootstrap.js" th:src="@{/static/js/thymeleaf.js}"></script>

'''
將配置文件都放在static下面.然后使用相對路徑來查找

以下是HTML引入方法，如果springboot使用thymeleaf模板，下面寫法無法正常引入資源文件，需改為thymeleaf引入方法
HTML引入方法：
'''

<link href="/css/bootstrap.min.css" rel="stylesheet">
<script src="/js/jquery.js"></script>

'''
至此bug結束.

語法規則

th:text；改變當前元素里面的文本內容

th：任意html屬性；來替換原生屬性的值

th:include：加載模板的內容： 讀取加載節點的內容（不含節點名稱），替換div內容

th:replace：替換當前標簽為模板中的標簽，加載的節點會整個替換掉加載他的div

th:attr 來設置任意屬性

th:attrprepend 來追加(不是替換)屬性值

th:classappend

th:each每次遍歷都會生成當前這個標簽

th:href="@{...}" 替換url

th:text="${...}"　　　　 轉譯特殊字符，特殊符號原方不動輸出

th:utext="${...}　　　　會轉譯字符,特殊符號被轉譯后輸出結果