#HTML基础汇总实验 ##1.1 实验内容之前的实验学习了HTML相关的基础知识，那么本次实验我们就来用前面学到的知识完整的做一个网页吧。 ##1.2 实验知识点实验总体设计总体框架及布局具体模块实现模块二、实验步骤实验中的代码可以通过命令下载在实验楼环境中下载运行测试 git clone https://github.com/shiyanlou/finaltest 2.1 实验总体设计在开始之前我们对网页应该有大致的把握，也就是说，在开始之前我们就要清楚我们要实现的目标，对应的最基础的框架结构，并且通过使用我们学过的那些标签和属性来实现，对于这个实验。我们可以随便在网上找一个样式简单点的网页来实现，这可能要涉及到一小部分的css样式的内容（毕竟只用HTML很难写出相同的效果）。下面我们就先展示一下我们要完成的效果： ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526027716435.png-wm) 大家可以看出，这个页面实现起来难度应该不大，这里涉及到布局，图片的插入，背景颜色调整，链接实现页面内的跳转，表单实现文本输入和邮件发送，再加上最基础的文本格式，用我们前面讲过的知识，足以对付。下面，我们就先来用一个结构图将这个页面的结构为大家剖析一下。让大家对这个实验结构有更好的理解：图片描述信息 ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526029983568.png-wm) 代码：

we are engineers

we are young

Working

Eating

Playing

Sleeping

let's learn with us
good good study, day day up

实验效果： ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526030798588.png-wm) ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526030844006.png-wm) ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526030948397.png-wm) ![图片描述](https://dn-simplecloud.shiyanlou.com/uid/386749/1526031049060.png-wm)

Colorful Shi yan Lou

we are engineers

Working

Eating

Playing

Sleeping

let's learn with us
good good study, day day up

Send emali to shiyanlou

Colorful Shi yan Lou

we are engineers

Working

Eating

Playing

Sleeping

let's learn with us good good study, day day up

Send emali to shiyanlou

let's learn with us
good good study, day day up

“HTML基础入门”实验报告