Java联盟

《编程基础:HTML第十四章 完结篇》:如何制作一个制作登录界面

2017-08-28  本文已影响0人  Java联盟

作者|李娜

*本文为「Java联盟」原创内容,转载无需授权,请保留署名来源。

啊哈!!!传说中的娜姐又回来了!

今天就给大家带来 html编程基础篇 最后一章 完结篇

《如何制作一个制作登录界面?》

步入正题

先看看效果图

怎么样,看着还是很像那么回事吧!

我要是不说,你们会不会以为我再和你们吹牛!

嗯!

上大图!

后面就是一张背景图片,我们不要在意这些细节,我们主要的是学习技术,懂吗?学习知识!!

首先分析页面的结构:

大致分成如下几块:

最大的一块,放置背景图片

(美工的妹妹有点忙我就,娜姐就随便找了张图。小伙伴们就当真的看哈!)

第二大块是为了定位,好吧!我们的登陆界面定在页面的右侧!

第三大快就是我们的主体,登陆界面了!

第四,第五块就是我们的内容了!

动工

上代码:

看看这效果:

要是网站加载出来是这个样子,我想谁也不会去想登录一下吧?

这浓浓的假冒网站的气息扑面而来呀!

打开这网页我都害怕我这电脑中毒…

所以小伙伴们包装是多么的重要!对不对!

(所以有时间,就收拾一下自己,不要以为,你通宵出来的造型多么潇洒不羁,女孩子更喜欢干净,阳光一点的男生懂吗?为你们我也是操碎了心了…等娜姐有时间给你们开开小灶)

样式代码奉上:

效果图我已将展示过了!

知识点

知识点1:

form 表单

form详解:

action 规定当提交表单时向何处发送表单数据

method 规定用于发送 form-data 的 HTTP 方法

target      规定action 属性中提交的页面会在何处打开

name      名字

form表单是一个包含表单的元素区域

表单能够包含 input 元素,比如文本字段、复选框、单选框、提交按钮等等。(输入信息)

表单用于向服务器传输数据。(把我们输入的账号密码什么的传到后台处理!)

知识点2:

input:

type中的类型

text         文本框

password 密码

radio         名字

checkbox 复选

好的今天就给大家分享这些知识了。

说实话,登录界面什么的真的是,烦得要死,尤其是哪些需要验证码的界面,所以,娜姐今天给大家分享的登录界面,没有设置验证码的选项哦!

(那个说我不会做验证码的胖子站住,看招!阿打~~~姐也是练过的!哼!)

闲杂人等,清场完毕!

当然有什么问题或者需要李娜我给大家分享讲解的地方,可以在留言区留言告诉我,整理后会在公众号里面分享讲解哦!

有疑问?请留言!关注Java联盟微信公众号,看Java要闻!

上一篇 下一篇

猜你喜欢

热点阅读