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文件下可正常使用
image
这几天使用新的框架去写的时候就出了新的bug
使用Springboot+thymeleaf+bootstarp写的时候一直在导入css上面出了bug.
image
找不到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下面.然后使用相对路径来查找

image

以下是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="${...}    会转译字符,特殊符号被转译后输出结果


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM