您的位置：360文档中心› 南华大学web课程设计实验报告

南华大学web课程设计实验报告

南华大学web课程设计实验报告
南华大学web课程设计实验报告

南华大学

计算机科学与技术学院实验报告

（2016 ~2017 学年度第1 学期）课程名称Web前端开发技术实验名称Web实验报告

姓名刘让洲学号20144350101

专业软件工程班级1班

地点寝室教师刘洋

第一章

一、第一章所学内容知识点：

在第一章中，我们学习了什么是web技术，对web技术有一定的了解，知道进行web开发以后要学习的各种技术以及对各种技术的简单介绍，为后面的学习打基础。

二、第一章实验：

实验1-1源代码：

Web前端技术初步应用

Web前端开发技术

HTML

CSS

JavaScript

网络学习资源

HTML教程

实验1-2-1实验截图：

实验1-2-2实验截图

第二章

一、第二章所学内容知识点：

在第二章中，我们学习了HTML的基本文档结构以及基本的语法，包括等标签的学习。</p><p>二、第二章实验：</p><p>实验2-1源代码：</p><p><!doctype html></p><p><html lang="en"></p><p><head></p><p><meta charset="UTF-8"></p><p><title>求知家园

欢迎来到我们的求知家园！

实验2-1运行结果：

实验2-1源代码：

Google搜索

欢迎使用Google搜索！

src="img/google.jpg"width="275"height="95"border="0"a lt="">

实验2-2运行结果：

第三章

一、第三章所学内容知识点：

在第三章中，我们学习Web页面初步设计，如：向Web中添加文字信息，格式化文本标记，怎样进行段落的排版与设计，以及相应的各种标签的应用等；

二、第三章实验：

实验3-1实验源代码：

刘让洲的自荐信

刘让洲自荐信

尊敬的领导：

    您好！

    感谢您在百忙之中启阅我的自荐材料！相信此刻的停留不会让您失望！

    我是

style="color:red;">南华大学计算机科学与技术学院2014级学生刘让洲。经过将近四年的大学学习和锻炼，与同龄人一样，我即将走上工作岗位，通过社会来证实自己的知识和能力。为了找到一份符合自己特长和兴趣的工作，更好地发挥自己的才能，实现自己的人生价值，我冒昧地写下这封信，希望能得到您的认可，能为贵公司服务。

    此致

敬礼!

联系

E-mail:416528046@https://www.360docs.net/doc/d514764444.html,

实验3-1运行截图：

实验3-2实验源代码：

数学方程式

数学方程式

2x2+3x=9

x1+x2=10

实验3-2运行截图：

第四章

一、第四章所学内容知识点：

在第四章中，我们主要学习了网页中列表的制作，包括有序列表，无序列表，列表嵌套以及自定义列表等；

二、第四章实验：

实验4-1源代码：

windows不同版本

  1. windows 95

  2. windows 98

  3. windows NT

    • windows NT Workstation

    • windows NT Server

  4. windows 2000

    • windows 2000 Professional

    • windows 2000 Server

    • windows 2000 Advance Server

  5. windows xp

  6. windows vista

  7. windows 7

  8. windows 8

实验4-1运行截图：

实验4-2源代码：

第四届中国大学出版社图书奖公示

第四届中国大学出版社图书奖公示

优秀教材一等奖（68种）

1.刑事诉讼法（第五版），陈光中主编，北京大学

出版社

2.普通化学原理（第4版），华彤文，王颖霞，卞江，陈景祖编著，北京大学出版社

3.音韻學教程（第四版），唐作藩著，北京大学出版社

4.保险学(第5版)，孙祁祥著，北京大学出版社

...

优秀教材二等奖（119种）

1.艺术欣赏教程（第2版），杨辛、谢孟主编，北京大学出版社

2.经济学基础（第6版），[美] 曼昆著，北京大学出版社

3.创新管理：赢得持续竞争优势（第2版），陈劲著，北京大学出版社

4.医学遗传学（第3版），傅松滨主编，北京大学医学出版

...

实验4-2运行截图：

第五章

一、第五章所学内容知识点：

在第四五章中，我们主要学习了网页中的超链接，网页中链接的标签，路径以及分类，图片链接等；

三、第四章实验：

实验5-1源代码：

apple网站

apple网站

  • href="https://www.360docs.net/doc/d514764444.html,/iphone/">

    src="img/1.PNG">

  • href="https://www.360docs.net/doc/d514764444.html,/iphone/">

    src="img/2.PNG"">

  • href="https://www.360docs.net/doc/d514764444.html,/macbook-pro/">

    src="img/3.PNG"">

  • href="https://www.360docs.net/doc/d514764444.html,/supplierresponsibility/ ">

实验5-1运行截图：

实验5-2源代码：

桂林山水风景图片

桂林山水风景图片

实验5-2运截图：

第六章

一、第六章所学内容知识点：

在第一章中，我们主要学习了怎样在网页插入图像和音乐，视频等多媒体，滚动文字，背景音乐使得网页更加炫酷了一点呢。

二、第六章实验：

实验6-1原代码：

图像对齐方式应用

图像对齐方式应用

未设置对齐方式的图像:

PNG，图像文件存储格式，其目的是试图(原来此处使用了"企图")替代GIF和TIFF文件格式，同时增加一些GIF文件格式所不具备的特性。

已设置对齐方式的图像：

PNG使用了从LZ77派生的一个非专利无失真式压缩算法（名为deflation）。这个算法对图像里的直线进行预测然后存储颜色差值，这使得PNG 经常能获得比原始图像甚至比GIF更大的压缩率。但也有一些软件不能使用适合的预测而造成过分臃肿的PNG文件。

PNG使用了从LZ77派生的一个非专利无失真式压缩算法（名为deflation）。这个算法对图像里的直线进行预测然后存储颜色差值，这使得PNG

经常能获得比原始图像甚至比GIF更大的压缩率。但也有一些软件不能使用适合的预测而造成过分臃肿的PNG文件。

PNG使用了从LZ77派生的一个非专利无失真式压缩算法（名为deflation）。这个算法对图像里的直线进行预测然后存储颜色差值，这使得PNG经常能获得比原始图像甚至比GIF更大的压缩率。但也有一些软件不能使用适合的预测而造成过分臃肿的PNG文件。

实验6-1运行截图：

实验6-2源代码：

图像画廊