微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

PHP实现登录注册之BootStrap表单功能

前言

前面几篇简单介绍了一下前端与PHP的一些知识点,前端中表单提交是一个非常重要的模块,在本篇中我会介绍一些关于表单的知识,如果前面内容你掌握的不好并且没有大量的练习,我感觉你最好先把标签都记下来。

项目简介

登录注册是我们在web开发中最常见的模块,也是我们日常生活中经常接触的功能用户通过前端表单页面填写内容,通过POST方式提交到后台,然后经过PHP代码处理提交内容后,针对登录或者注册的逻辑继续操作。

登录注册图解

BootStrap前端框架[ ]

Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。

BootStrap如何使用呢?我们可以下载它的源代码到本地,也可以使用 BootCDN 提供的免费 CDN 加速服务。

首先我们搭建页面基本骨架

Register

然后我们点击起步找到如下内容

把红圈内CSS文件复制到我们页面中

Register

BootStrap给了许多案例,其中有一个登录页的案例

我们来仿一下这个页面

rush:js;"> <Meta charset="UTF-8"> Register body { padding-top: 40px; padding-bottom: 40px; background-color: #eee; }
.form-signin {
 max-width: 330px;
 padding: 15px;
 margin: 0 auto;
}
heading">Please sign in

这里面里面包裹的是CSS,如果有疑惑的地方可以逐个百度看一下,也可以先不写CSS,然后一点点的加上CSS代码效果。我们来分析一下HTML中的表单。

•form标签==>用来包裹表单内容,也是表单的起始标签

•form标签属性action==>action="xxx"里面填写的是处理该表单的PHP代码所在文件地址,点击提交按钮后表单会把数据发送到该地址。

•form标签属性method==>这个有点不好理解,你记着提交表单的时候里面填post就行,method="post",有兴趣的话可以百度查一下。

•input标签==>细心的朋友可以看到input是单个存在的, 标签规定了用户可以在其中输入数据的输入字段。 元素在

元素中使用,用来声明允许用户输入数据的 input 控件。

输入字段可通过多种方式改变,取决于 type 属性。常见的type属性有text,email,password,checkBox,radio,button,submit,hidden等,你可以尝试改变type来看效果

•input标签属性name==>这个name值是至关重要的,我们后台PHP代码之所以能够分辨每个值都是来自于哪个input框都是根据name="xx"来判断。

•input标签属性required==>如果用户什么都不写难道我们允许他们提交表单的吗?很明显不可以,所以我们需要让用户填写内容后再提交,required意思是必须的,如果不填写内容点击提交的时候,表单不会被提交。

总结

以上所述是小编给大家介绍的PHP实现登录注册之BootStrap表单功能,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐