在搭建的SpringBoot项目中,可以使用模板引擎,设计出不同样式的页面。如果页面模板中使用Bootstrap前端框架,需要将Bootstrap对应的js和css拷贝到指定文件夹中。
工具
IntelliJ IDEA 2020JDK8TomcatMavenGit技术
SpringBootjQueryHTML5CSS3Bootstrap
1、打开IntelliJ IDEA 2020开发工具,创建SpringBoot框架项目
创建SpringBoot框架项目2、在templates文件夹下,新建页面文件index.html
在templates文件夹下,新建页面文件3、配置项目的jdk,下载对应的依赖包,然后启动项目类
配置项目,下载依赖包,启动项目4、到Bootstrap官网下载,然后将js和css拷贝到指定文件夹
下载Bootstrap,拷贝js和css文件5、打开index.html文件,引入bootstrap中的css和js文件
引入bootstrap中的css和js文件6、重新启动项目,访问项目,结果浏览器控制台出现了报错
启动项目,访问项目,检查报错7、检查代码发现,由于jquery没有引入
解决报错问题8、在<body></body>标签中,插入一个table,然后添加Bootstrap对应的表格样式
body标签中,插入表格元素和表格样式9、再次启动项目,刷新浏览器,可以查看到表格
刷新并查看界面效果说明:
1、在SpringBoot框架项目中,可以使用模板引擎,快速搭建前端项目
2、前端页面修改了样式或业务逻辑,需要重复启动项目,才能查看效果