Spring boot项目中展示HTML页面效果
2017-04-23 11:05
465 查看
一、在spring boot项目下新建一个“static”文件夹,把用到的js文件夹和HTML页面文件放在该文件目录下。本例中,是使用jquery mobile创建的是一个mobile web页面。
2、HTML页面内容
3、点击运行按钮,启动项目
4、输入地址:“http://localhost:8080/”,用googlel浏览器 调试的页面效果
2、HTML页面内容
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>基本的页面</title> <meta name="viewport" content="width=device-width,initial-scale=1"> <link rel="stylesheet" href="js/jquery.mobile-1.4.3.css"/> </head> <body> <div data-role="page" id="index1"> <div data-role="header"> <h1>我是标题1</h1> </div> <div role="main" class="ui-content"> <p>我是内容1<p> <p><a href="#index2">index2</a></p> </div> <div data-role="footer"> <h1>我是页脚1</h1> </div> </div> <div data-role="page" id="index2"> <div data-role="header"> <h1>我是标题2</h1> </div> <div role="main" class="ui-content"> <p>我是内容2<p> <p><a href="#index1">index1</a></p> </div> <div data-role="footer"> <h1>我是页脚2</h1> </div> </div> <script src="js/jquery.js"></script> <script src="js/jquery.mobile-1.4.3.js"></script> </body> </html>
3、点击运行按钮,启动项目
4、输入地址:“http://localhost:8080/”,用googlel浏览器 调试的页面效果
相关文章推荐
- thymeleaf :springboot整合mybatis的web项目中使用html而不是jsp当页面渲染
- 关于html5与jsp页面同样的html代码展示的页面效果不一样的问题
- SpringBoot项目如何访问jsp页面
- 【系统学习SpringBoot】初见Thymeleaf之SpringBoot访问项目中的 jsp/html
- springboot学习(3)springboot使用jsp完成数据的页面展示
- SpringBoot项目如何访问jsp页面的示例代码
- spring boot 静态页面展示
- SpringBoot+thymeleaf项目页面的一些问题
- eclipse搭建简单springboot-mybatis项目实现页面简单跳转
- springboot vue.js axios.js ajax请求纯HTML页面传值
- Spring Boot使用freemarker并且生成静态html页面
- 1j2ee即web项目,严格意义上来说,没有jsp代码,只有class文件、html文件、javascript文件。2 基于extjs框架的项目怎么怎么查看在浏览器中展示的最终html页面的代码 3
- Spring-boot 设置首页跳转到Html页面
- [Gradle中文教程系列]-跟我学Gradle-8.7.多模块项目之 - spring boot + gradle + 构建公共jsp页面的多模块项目
- IDEA 快速搭建springboot项目,返回HTML首页
- 关于html5与jsp页面同样的html代码展示的页面效果不一样的问题
- 关于html5与jsp页面同样的html代码展示的页面效果不一样的问题
- 快速构建Spring boot项目(功能是检测访问页面的设备)
- springBoot+springSecurity+freemarker项目中页面获取当前登录用户
- 【spring boot】5.spring boot 创建web项目并使用jsp作前台页面