javaWeb核心技术第六篇之BootStrap
2019-08-26 05:41:44来源：博客园 阅读 ()
javaWeb核心技术第六篇之BootStrap
概述: Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。 作用: 开发响应式的页面 响应式:就是一个网站能够兼容多个终端 节约开发成本,提高开发效率 入门: 下载BootStrap www.bootcss.com 官网地址 模版 1.导入BootStrap的css 2.导入jquery的js(1.8+) 3.导入BootStrap的js 4.设置视口(支持移动设备) <meta name="viewport" content="width=device-width, initial-scale=1"> 5.添加一个布局容器 通过div设置一个 class 方式1:class="container" 方式2:class="container-fluid" 核心: 全局CSS 设置全局 CSS 样式；基本的 HTML 元素均可以通过 class 设置样式并得到增强效果；还有先进的栅格系统。 媒体查询(了解) 默认有一些分辨率临界点的阀值 分辨率 屏幕大小 分辨率>=1200px 超大屏幕 992<=分辨率<1200 中等屏幕 768<=分辨率<992 小屏幕 分辨率<768 超小屏幕 栅格系统★ 在不同分辨率的屏幕下展示不同的效果,根据不同的上网设备,栅格系统将屏幕分成一系列的行(row)和列(column),由行和列来创建页面布局,注意栅格系统必须放在布局容器内使用 行: 通过class = "row"来设置一行 列(最多将视口分为12列) 通过class属性来设置在不同屏幕是所占的列 n表示每格占的份数 col-lg-n 大屏 分辨率>=1200 col-md-n 中屏 992<=分辨率<1200 col-sm-n 小屏 768<=分辨率<992px col-xs-n 超小屏 分辨率<768px 案例: <div class="container"> <div class=" col-md-2 col-sm-3 hidden-xs" style="border: solid 1px red;height: 20px;">1</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">2</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">3</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">4</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">5</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">6</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">7</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">8</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">9</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">10</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">11</div> <div class=" col-md-2 col-sm-3 col-xs-6" style="border: solid 1px red;height: 20px;">12</div> </div> 响应式工具: 显示: .visible-xs 超小屏可见 .visible-sm 小屏可见 .visible-md 中等屏幕可见 .visible-lg 大屏可见 隐藏: .hidden-xs 超小屏时隐藏 .hidden-sm 小屏幕时隐藏 .hidden-md 中等屏幕时隐藏 .hidden-lg 大屏幕时隐藏 标题: .h1 -- .h6 对齐方式:(文本) .text-left 左对齐 .text-center居中 .text-right 右对齐 列表: .list-unstyled 移除默认的列表样式 .list-inline 将所有列表项放置同一行 表格:bootstrap给表格添加了默认样式 .table 普通表格 .table-striped 条纹表格(IE8不支持) .table-bordered 边框表格 .table-hover 带有鼠标悬停的表格 .table-condensed 紧缩表格 表单: 垂直表单: 内联表单:(将所有内容放在同一行) 水平表单: 按钮:★ .btn 为按钮添加基本样式 .btn-default 默认/标准按钮 .btn-primary 原始按钮样式（未被操作） .btn-success 表示成功的动作 .btn-info 该样式可用于要弹出信息的按钮 图片: .img-rounded 为图片添加圆角 (IE8 不支持) .img-circle 将图片变为圆形 (IE8 不支持) .img-responsive 图片响应式 组件 无数可复用的组件，包括字体图标、下拉菜单、导航、警告框、弹出框等更多功能。 下拉选: 导航条: javaScript插件 jQuery 插件为 Bootstrap 的组件赋予了“生命”。可以简单地一次性引入所有插件，或者逐个引入到你的页面中。 图片轮播 综合案例: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1" /> <title></title> <link rel="stylesheet" href="css/bootstrap.css" /> <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> <script> $(function() { $('.carousel').carousel({ interval: 1000 }) }); </script> </head> <body> <div class="container"> <!--1.topbar--> <div class="row text-center"> <!--img1:中等屏幕时占4份,在小屏时占6份,在超小屏时占12份 img2:中等屏幕时占4份,在小屏时隐藏,在超小屏时占12份 超链接:中等屏幕时占4份,在小屏时占6份,在超小屏时占12份--> <div class="col-md-4 col-sm-6"> <img src="img/logo2.png" /> </div> <div class="col-md-4 hidden-sm"> <img src="img/header.jpg" /> </div> <div class="col-md-4 col-sm-6 text-center" style="padding-top: 20px;"> <a href="#" class="btn btn-default">登录</a> <a href="#" class="btn btn-default">登录</a> <a href="#" class="btn btn-default">登录</a> </div> </div> <!--2.导航条--> <div class="row"> <nav class="navbar navbar-inverse"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">首页</a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li class="active"> <a href="#">手机数码 <span class="sr-only">(current)</span></a> </li> <li> <a href="#">电脑办公</a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a> <ul class="dropdown-menu"> <li> <a href="#">Action</a> </li> <li> <a href="#">Another action</a> </li> <li> <a href="#">Something else here</a> </li> <li role="separator" class="divider"></li> <li> <a href="#">Separated link</a> </li> <li role="separator" class="divider"></li> <li> <a href="#">One more separated link</a> </li> </ul> </li> </ul> <form class="navbar-form navbar-right"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search"> </div> <button type="submit" class="btn btn-default">Submit</button> </form> </div> <!-- /.navbar-collapse --> </div> <!-- /.container-fluid --> </nav> </div> <!--3.轮播图--> <div class="row"> <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data-slide-to="1"></li> <li data-target="#carousel-example-generic" data-slide-to="2"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="./img/1.jpg" alt="..."> <div class="carousel-caption"> 欢迎你... </div> </div> <div class="item"> <img src="./img/2.jpg" alt="..."> <div class="carousel-caption"> </div> </div> <div class="item"> <img src="./img/3.jpg" alt="..."> <div class="carousel-caption"> </div> </div> </div> <!-- Controls --> <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </div> <!--4.热门商品--> <div class="row"> <div> <span class="h2">热门商品</span><img src="img/title2.jpg" /> </div> <!--下div: 左div:中等屏幕时占2份,小屏和超小屏隐藏 图片 右div:中等屏幕时占10份,小屏和超小屏占12份 middle div:中等屏幕时占6份,小屏和超小屏隐藏 图片 商品div:中等屏幕时占2份,小屏占4份,超小屏时占6份 图片 2个p标签--> <div class="row"> <!--左div:中等屏幕时占2份,小屏和超小屏隐藏 图片--> <div class="col-md-2 hidden-sm hidden-xs"> <img src="img/big01.jpg" width="100%" height="100%" /> </div> <!--右div:中等屏幕时占10份,小屏和超小屏占12份 --> <div class="col-md-10"> <!--middle div:中等屏幕时占6份,小屏和超小屏隐藏 图片--> <div class="col-md-6 hidden-sm hidden-xs"> <img src="img/middle01.jpg" width="100%" height="180px" /> </div> <!--商品div:中等屏幕时占2份,小屏占4份,超小屏时占6份 图片 2个p标签--> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> </div> </div> </div> <!--5.图片--> <div class="row"> <img src="img/ad.jpg" width="100%" /> </div> <!--6.热门商品--> <div class="row"> <div> <span class="h2">热门商品</span><img src="img/title2.jpg" /> </div> <!--下div: 左div:中等屏幕时占2份,小屏和超小屏隐藏 图片 右div:中等屏幕时占10份,小屏和超小屏占12份 middle div:中等屏幕时占6份,小屏和超小屏隐藏 图片 商品div:中等屏幕时占2份,小屏占4份,超小屏时占6份 图片 2个p标签--> <div class="row"> <!--左div:中等屏幕时占2份,小屏和超小屏隐藏 图片--> <div class="col-md-2 hidden-sm hidden-xs"> <img src="img/big01.jpg" width="100%" height="100%" /> </div> <!--右div:中等屏幕时占10份,小屏和超小屏占12份 --> <div class="col-md-10"> <!--middle div:中等屏幕时占6份,小屏和超小屏隐藏 图片--> <div class="col-md-6 hidden-sm hidden-xs"> <img src="img/middle01.jpg" width="100%" height="180px" /> </div> <!--商品div:中等屏幕时占2份,小屏占4份,超小屏时占6份 图片 2个p标签--> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> <div class="col-md-2 col-sm-4 col-xs-6 text-center"> <img src="img/small08.jpg" /> <p>妹子</p> <p>288</p> </div> </div> </div> </div> <!--7.图片--> <div class="row"> <img src="img/footer.jpg" width="100%" /> </div> <!--8--> <div class="row text-center"> <p> <ol class="list-unstyled list-inline"> <li><a href="#">联系我们</a></li> <li><a href="#">联系我们</a></li> <li><a href="#">联系我们</a></li> <li><a href="#">联系我们</a></li> <li><a href="#">联系我们</a></li> <li><a href="#">联系我们</a></li> </ol> </p> <p>Copyright © 2005-2016 版权所有</p> </div> </div> </body> </html> 案例-将我们的项目发布出去 需求分析: 将我们编写好的(web项目)项目放到服务器上,这样以来用户就可以通过网络访问到我们的(web项目)项目了 技术分析: web服务器 web项目 Http协议 ////////////////////////// http://localhost/webDemo/html/hello.html get /////////////////// day33HTTP&Tomcat - Web服务器 - 概念: - web资源: "英文直译"网"的意思 资源:一切数据文件 web资源:通过网络可以访问到的资源,通常指的是一切放在服务器上的文件" - web资源的分类: - 静态的web资源: " 内容是一成不变的" - 动态的web资源: " 内容有可能在不同的时间或者不同的人访问的时候会发生改变的" - web技术分类 - 静态的web技术 " 例如: html css js ....." - 动态的web技术 " 例如:servlet jsp" - 软件的架构 - c/s架构(Client/Server 客户端/服务器) " 例如:qq 迅雷 lol" - b/s架构(Browser/Server 浏览器/服务器) " 例如:京东 淘宝 " - 区别 - c/s:需要客户下载客户端,页面比较炫,和服务器交互少,可以在客户端处理部分业务逻辑,可降低服务器的压力.需要维护客户端和服务器端 - b/s:只需要客户有一个浏览器,一切页面从服务器加载,和服务器交互频繁,由服务器处理业务逻辑,服务器压力较大.只需要维护服务器端. - 通讯机制 - 基于http协议 - 浏览器发送给服务器的内容:请求(request) - 服务器返回给浏览器的内容:响应(response) - 注意:先有请求,后有响应,一次请求对应一次响应 - web服务器 - 作用:将我们编写好的网页发布出去,别人就可以通过网络访问 - 常见的web服务器 "名称 厂商 特点 Weblogic oracle 大型的收费的支持javaEE所有规范的web服务器(servlet和jsp) websphere ibm 大型的收费的支持javaEE所有规范的web服务器(servlet和jsp) tomcat apache 小型的免费的支持servlet和jsp规范的"web服务器"" - Tomcat服务器★ Tomcat如何优化? 1: 优化连接配置.修改连接数,关闭客户端的dns查询(DNS查询需要占用网络，再获取对方ip的时候会消耗一定的时间) 2: 优化jdk,扩大tomcat使用的内存,默认为128M - 下载 - http://tomcat.apache.org/download-70.cgi - core: - zip:可以在window上运行的(我们今天使用) - tar.gz:运行在linux上的 - 安装 - 解压缩即可 - 目录结构 - bin:存放可执行的文件 - ★conf:存放配置文件 - lib:存放的是tomcat运行时和项目运行时必须的jar包 - logs:存放的是日志文件(catalina.out) - temp:存放临时文件(不用管) - ★★webapps:存放要发布的web项目 - ★work:存放项目运行时产生的java文件和class文件 - 启动 " 双击 tomcat目录下/bin/startup.bat" - 关闭 " 方式1:点 x 方式2:ctrl + c (记住)方式3:双击 tomcat目录下/bin/shutdown.bat" - 配置 - 常见问题 - 一闪而过 "查看JAVA_HOME是否配置正确" - 端口占用: 可以修改Tomcat的端口号 "修改 tomcat目录下/conf/server.xml 大约70行 <Connector port="8080" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="8443" /> 需要将 8080 修改成其他的端口号 端口号:0~65535 0~1024:系统预留的端口号 一般不要使用 但是可以使用80端口 80端口是http协议的默认端口号,访问的时候可以不写端口号" - 访问格式 - tomcat的访问路径(8080是tomcat的默认的端口号) " http://localhost:8080" - 格式:http://ip地址:端口号/项目名/资源?参数名称=值&参数名称=值 - web项目 - 目录结构:★ "myweb(目录名:项目名) | |---资源文件 html img css js |---WEB-INF(目录:特点,通过浏览器直接访问不到) | | | |---lib(目录:项目运行的jar包) | |---classes(目录:存放的class文件) | |---web.xml(核心配置文件,在servlet2.5版本中必须有,serlvet3.0版本不是必须的)" - 项目访问路径: "http://localhost:80/myweb/1.html 协议://ip地址:端口/项目名称/资源" - Tomcat和Eclipse整合 - Http协议: - 协议:规定内容的传输的格式 - http协议: "用来制定互联网上数据的传输格式" - 包含: - 浏览器发送给服务器的内容 请求 "规定请求数据的格式" - 服务器返回给浏览器的内容 响应 "规定响应数据的格式" - 请求的格式: "请求行 请求头 请求体" - 请求行:请求的第一行 - 格式:请求方式 请求资源 协议/版本 "例如: GET /day33/1.html HTTP/1.1" - 请求方式: "常见的两种 get和post get请求:请求参数会在地址栏上显示,参数大小有限制,不安全 http://ip地址:端口号/项目名/资源?参数名称=值&参数名称=值 post请求:请求参数不在地址栏上显示,参数大小不受限制.较为安全 格式: 参数名称=值&参数名称=值" - 请求头 - 格式: key/value的格式 (value可以为多个值的) - 常见的请求头 - Accept: text/html,image/* --支持数据类型 - Accept-Charset: ISO-8859-1 --字符集 - Accept-Encoding: gzip --支持压缩 - Accept-Language:zh-cn --语言环境 - Host: www.baidu.cn:80 --访问主机 - If-Modified-Since: Tue, 11 Jul 2000 18:23:51 GMT --缓存文件的最后修改时间 - Referer: http://www.baidu.com/index.jsp --来自哪个页面、防盗链 - User-Agent: Mozilla/4.0 (compatible; MSIE 5.5; Windows NT 5.0) "扩展知识: Trident内核代表产品Internet Explorer，又称其为IE内核 Gecko内核代表作品Mozilla FirefoxGecko,火狐 Chrome内核代表作品Chrome,谷歌" - Cookie - Connection: close/Keep-Alive --链接状态 - 重要的头: - Referer User-Agent Cookie If-Modified-Since - 请求体 "和请求头之间有一个空行 post请求的参数:只有表单提交的时候明确了method="post"这时候是post请求,其他的都是get请求 参数名称=值&参数名称=值 username=jack&password=1234" - 响应的格式: "响应行 响应头 响应体" - 响应行:响应信息的第一行 - 格式: - 协议/版本 响应的状态码 状态码说明 - 例如: - HTTP/1.1 200 OK - 状态码: - 1xx :请求已发送 - 2xx :响应已完成 - 200:响应成功(请求成功) - 3xx :需要浏览器进一步操作才可以完成 - 302:重定向(配合location头使用) - 304:读缓存(Not Modified表示没有改变) - 4xx :用户访问错误(Not Found 表示:路径写错了,你访问的路径不存在) - 404:用户访问的资源不存在 - 5xx :服务器内部错误(其实就是代码有问题,改代码) - 500:服务器内部异常 - 响应头 - 格式: key/value的格式 (value可以为多个值的) - 常见的响应头 - Location: http://www.it315.org/index.jsp --跳转方向 - Server:apache tomcat --服务器型号 - Content-Encoding: gzip --数据压缩 - Content-Length: 80 --数据长度 - Content-Language: zh-cn --语言环境 - Content-Type: text/html; charset=GB2312 --数据类型(MIME类型) 大类型/小类型 text/css text/javascript image/jpeg image/bmp - Last-Modified: Tue, 11 Jul 2000 18:23:51 GMT --最后修改时间 - Refresh: 1;url=http://www.it315.org --定时刷新 - Content-Disposition: attachment; filename=aaa.zip --下载 - Set-Cookie:SS=Q0=5Lb_nQ; path=/search - Expires: -1 --缓存 - Cache-Control: no-cache --缓存 - Pragma: no-cache --缓存 - Connection:Keep-Alive --连接 - 重点的头: - Set-Cookie Location Content-Type Refresh Content-Disposition Last-Modified - 响应体 "和响应头之间有一个空行, 浏览器解析的内容" - servlet入门: "本质上就是一个运行在服务器上的类" - 作用:1.接受请求 2.调用Service 处理业务逻辑 3.生成响应结果 - 入门步骤: - 1.编写一个类 - 必须实现Servlet接口 - 重写里面的方法 - 2.编写配置文件(项目下 web-inf/web.xml) "注册servlet 绑定路径 <!-- 注册servlet servlet-name:给servlet起个名称 名称自定义,保证唯一 servlet-class:serlvet的全限定名(包名+类名) --> <servlet> <servlet-name>helloservlet</servlet-name> <servlet-class>cn.baidu.demo.HelloServlet</servlet-class> </servlet> <!-- 绑定路径 servlet-name:在servlet标签中给servlet起好的名称 url-pattern:路径 暂时都以"/"开头 --> <servlet-mapping> <servlet-name>helloservlet</servlet-name> <url-pattern>/hello</url-pattern> </servlet-mapping>" - 3.测试 " localhost/项目名/绑定的路径 localhost/day33/hello" 在服务器中,为什么需要项目部署? 为了让网络通过服务器访问到项目 回顾: tomcat服务器和Http协议: web服务器: 概念: web资源: web资源分类: 静态的web资源:内容一层不变 动态的web资源:根据不同的人和不同的时间,可能会发生变化 web技术: 静态的web技术:html css js... 动态的web技术:Servlet jsp 结构: B/S(浏览器/服务器): C/S(客户端/服务器): 通讯机制: 基于HTTP协议 一次请求一次响应,先有请求后有响应 web服务器: Tomcat: 下载: 安装: 目录结构: bin: conf: webapps: work: 启动: bin/startup.bat 关闭: X ctrl + c ★ bin/shutdown.bat 访问: 协议://地址:端口/资源 web项目: 项目名称: |-------html |-------css |-------js |-------img |-------WEB-INF |-----------lib |-----------classes |-----------web.xml http: 请求:浏览器发送给服务器的内容(request) 请求行 请求信息的第一行 请求方式 请求的资源 协议/版本 http/1.0 http/1.1 请求头 格式: key/value (value可以为多个值) 请求体 当请求是post的时候,存放post请求所携带的参数 响应:服务器返回给浏览器的内容(response) 响应行 响应信息的第一行 协议/版本 状态码 说明 响应头 格式: key/value (value可以为多个值) 响应体 浏览器解析的内容 //////////////////////////////////////////// servlet: 案例-使用servlet完成用户登录功能 需求分析: 用户在表单中填写完用户名和密码后,点击登录的时候,向服务器发送登录的请求, 在服务器上处理请求,处理完毕后将处理信息响应到页面 处理结果: 登录成功:欢迎...登录... 登录失败:用户名或密码错误 异常:当前功能正在维护.... 技术分析: html:表单 form action:提交路径 method:提交方式 get post servlet: request response //////////////// 项目: com.baidu.web com.baidu.service com.baidu.dao com.baidu.domain com.baidu.utils 导入jar包 导入工具类
原文链接:https://www.cnblogs.com/haizai/p/11368042.html
如有疑问请与原作者联系
标签：
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有
相关文章
- 2020年Web前端开发工程师市场怎么样？学会什么技术才能拿到 2020-06-06
- web前端是什么？需要掌握什么技术？ 2020-05-30
- 毕业生如果想学web前端技术，应该如何学才能快点找到工作 2020-05-25
- 如何学好Web前端开发技术？前端学习路线是什么？ 2020-05-19
- 6个web前端核心技术，你学到哪个了呢？ 2020-04-28
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash
热门词条
最新资讯
热门关注
热门标签