<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!--标题,里面填写的内容将在浏览器顶部小框中显示-->
<title></title>
</head>
<body>
<!--将网页分成三个部分,头部-->
<header>
<h1><a href="#"><img src="../img/163logo.gif" alt="logo"/></a></h1>
<p>
<a href="#">免费邮</a>
<a href="#"> 企业邮</a>
<a href="#">VIP邮箱</a>
<a href="#">帮助</a>
</p>
</header>
<!--中部-->
<section>
<div>
<img src="../img/imap.jpg" alt=""/>
<ul>
<li>163/126/yeah三大免费邮箱均默认开放</li>
<li>全面支持iPhone/iPad及Android等系统</li>
<li>客户端、手机与网页,实现发送、阅读邮件</li>
</ul>
<a href="#"><img src="../img/loginIcon.gif">普通登录 </a>
</div>
<form action="#" method="get">
<p>
用户名:
<input type="text" name="userName"/>
@163.com
</p>
<p>
密码:
<input type="password" name="psw"/>
</p>
<p>
版本:
<select name=""version id="">
<option value="">默认</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
</select>
</p>
<p>
<input type="checkbox" value="autoLogin"/>自动登录
<input type="checkbox" value="ssl" checked/>SSL
</p>
<input type="submit" value="登录"/>
<input type="submit" value="注册"/>
</form>
</section>
<!--尾部-->
<footer>
<img src="../img/netease_logo.gif" alt=""/>
<a href="#">关于网易</a>
<a href="#">免费邮 </a>
<a href="#">官方博客</a>
<a href="#">客户服务 </a>
<a href="#">隐私政策</a>|
<a href="#">网易公司版权所有 &copy; 2015-2018</a>
</footer>
</body>
</html>

上面是效果展示图,图片保存位置:右击当前web项目的img文件夹,打开文件所在目录(p)

将这四张图存入其中。<!--*******-->为注释 <ul></ul>为无序列表。

利用HTML制作一个简单的界面(工具HBuilder)的更多相关文章

  1. C#-用Winform制作一个简单的密码管理工具

    为什么要做? 首先是为了练习一下c#. 想必大家都有过记不起某个平台的账号密码的经历,那种感受着实令人抓狂.那这么多账号密码根本记不住!我之前用python写过一个超级简单(连账号信息都写在代码里那种 ...

  2. 用Qt写软件系列三:一个简单的系统工具(上)

    导言 继上篇<用Qt写软件系列二:QIECookieViewer>之后,有一段时间没有更新博客了.这次要写的是一个简单的系统工具,需求来自一个内部项目.功能其实很简单,就是查看当前当前系统 ...

  3. PureMVC和Unity3D的UGUI制作一个简单的员工管理系统实例

    前言: 1.关于PureMVC: MVC框架在很多项目当中拥有广泛的应用,很多时候做项目前人开坑开了一半就消失了,后人为了填补各种的坑就遭殃的不得了.嘛,程序猿大家都不喜欢像文案策划一样组织文字写东西 ...

  4. 制作一个简单的WPF图片浏览器

    原文:制作一个简单的WPF图片浏览器 注:本例选自MSDN样例,并略有改动.先看效果: 这里实现了以下几个功能:1.  对指定文件夹下所有JPG文件进行预览2.  对选定图片进行旋转3.  对选定图片 ...

  5. 基于node实现一个简单的脚手架工具(node控制台交互项目)

    实现控制台输入输出 实现文件读写操作 全原生实现一个简单的脚手架工具 实现vue-cli2源码 一.实现控制台输入输出 关于控制台的输入输出依然是基于node进程管理对象process,在proces ...

  6. 利用ANTLR4实现一个简单的四则运算计算器

    利用ANTLR4实现一个简单的四则运算计算器 ANTLR4介绍 ANTLR能够自动地帮助你完成词法分析和语法分析的工作, 免去了手写去写词法分析器和语法分析器的麻烦 它是基于LL(k)的, 以递归下降 ...

  7. 实例学习SSIS(一)--制作一个简单的ETL包

    原文:实例学习SSIS(一)--制作一个简单的ETL包 导读: 实例学习SSIS(一)--制作一个简单的ETL包 实例学习SSIS(二)--使用迭代 实例学习SSIS(三)--使用包配置 实例学习SS ...

  8. TensorFlow练习13: 制作一个简单的聊天机器人

    现在很多卖货公司都使用聊天机器人充当客服人员,许多科技巨头也纷纷推出各自的聊天助手,如苹果Siri.Google Now.Amazon Alexa.微软小冰等等.前不久有一个视频比较了Google N ...

  9. 手把手制作一个简单的IDEA插件(环境搭建Demo篇)

    新建IDEA插件File --> new --> Project--> Intellij PlatForm Plugin-->Next-->填好项目名OK 编写插件新建工 ...

随机推荐

  1. 如何用javascript中的canvas让图片自己旋转

    最近在写一个游戏,想让一个人物随着鼠标在原地旋转 在网上找了找,大都是用css写的,但是我为了长远的利益着想选择使用javascript代码中的canvas来解决绘图问题 其中重要的两个方法: con ...

  2. 转载:LESS基本用法

    转载出处:https://blog.csdn.net/qq_38209578/article/details/80566860 转载出处:https://blog.csdn.net/weixin_44 ...

  3. C# DataTable转json 时间格式化

    1.NewTonSoft.json public static string DataTableToJson(DataTable dt) { ) { return ""; } el ...

  4. 关于html 修改滚动条的问题

    之前项目需要改变滚动条的样式 一.修改原生样式 原文地址:https://blog.csdn.net/zh_rey/article/details/72473284 问题在于无法兼容火狐与ie等浏览器 ...

  5. 开发环境绑定host vue 返回 invalid host header

    事情:使用域名绑定host为本机电脑ip,vue返回 invalid host header 原因:新版的webpack-dev-server出于安全考虑,默认检查hostname,如果hostnam ...

  6. 一些常ArcGIS常用简单算法 C#

    最近开始重构不顺眼的辣鸡代码,顺带将某个模块的一个算法辅助类贴到这里. /// <summary> /// 算法逻辑辅助类 /// </summary> internal st ...

  7. python基础篇(文件操作)

    Python基础篇(文件操作) 一.初始文件操作 使用python来读写文件是非常简单的操作. 我们使用open()函数来打开一个文件, 获取到文件句柄. 然后通过文件句柄就可以进行各种各样的操作了. ...

  8. 通过yum在CentOS7部署LNMP环境(Centos7.4+Nginx1.12+mariadb5.5.56+PHP7.0)

    LNMP环境 CentOS Linux release 7.4.1708 PHP 7.0.25 nginx version: nginx/1.12.2 mariadb: 5.5.56-MariaDB ...

  9. rabbitmq的管理软件以及PHP7安装rabbitmq的

    rabbitmq-server管理软件的安装 1.mac下载rabbitmq-server brew install rabbitmq 2.启动服务rabbitmq-server rabbitmq-s ...

  10. Nginx Web 基础入门

    目录 Nginx Web 基础入门 Nginx快速安装 两种方式部署Nginx 如何升级nginx或者添加功能 使用systemd管理nginx nginx相关配置文件 nginx的配置文件详解 虚拟 ...