当前位置:文档之家› 实验一HTML、CSS网页制作实验

实验一HTML、CSS网页制作实验

实验一HTML、CSS网页制作实验
实验一HTML、CSS网页制作实验

实验一HTML、CSS网页制作实验

一、做出网页1.html,效果如下图所示:

要求如下:

1、诗的题目格式为红色、加粗、居中显示。

2、作者格式为红色、斜体、居右显示。

3、诗的内容字体格式从上到下分别是

,诗的第一行和第三行内容为蓝色字体。

二、做出网页2.html,效果如下图所示。

要求如下:

1、图像加边框。

2、图像相对于文字左对齐。

三、做出网页3.html,效果如下图所示:

要求如下:

文字颜色正常是#3c3c3c、白色背景,鼠标经过时变为#FF8400、#EDEEF0色背景。

四、请做出网页4.html,效果如下图所示。

五、请做出以下网页,效果如下图所示,保存为5.html:

六、请做出网页6.html,效果如下图所示:

要求如下:

1、使用内嵌式引入CSS样式表。

2、使用类选择器定义元素。

(1)通过控制不同的类,分别为第一个字母“G”设置为蓝色、加粗、60px 字体;

第二个字母“o”设置为红色、加粗、60px字体;

第三个字母“o”设置为黄色、加粗、60px字体;

第四个字母“g”设置为蓝色、加粗、60px字体。

(2)剩余字母“le”按默认样式输出。

七、请做出网页7.html,效果如下图所示。

要求如下:

1、设置所有文本为宋体、12像素、绿色字体,“春季”字体颜色设为红色。

2、设置标题“春天”为16像素、红色、加粗、居中、上划线的效果。

3、设置文本首行缩进2个字符。

八、请做出网页8.html,效果如下图所示:

要求如下:

1、设置所有文本为微软雅黑、14像素、黑色字体。

2、新浪”、“新浪网”为红色字体,“博客首页”为蓝色字体,网址及日期为绿色字体。

3、设置标题为16像素、左对齐、下划线的效果。

4、设置文本“-百度快照-评价”为灰色、下划线的效果。

电子商务专业网页制作实验报告

《网页设计与制作》 实验报告 院系名称:管理学院专业班级:电子商务 10级02班学生姓名:相栓霞学号: 201046900629 2012年 5 月 11 日

实验一:HTML语言实验 一、实验目的 1、掌握利用HTML语言编写网页的能力; 2、掌握利用HTML语言编写表格的能力; 3、掌握利用HTML语言编写表单的能力。 二、实验课时 2学时 三、实验内容 1、表格实验的结果 (1)实验步骤编制代码如下: 表格示例

(2)运行结果:

2、表单实验的结果 (1)实验步骤编制代码如下: 表单

A B C
D
E F G H
I
姓名:
密码:
性别:
爱好: 篮球

html实验报告

《企业网站开发》实验指导书 计算机科学与技术学院 2013-3

目录 实验一HTML语言标志 (1) 【实验目的】 (1) 【实验环境】 (1) 【实验重点及难点】 (1) 【实验内容】 (1) 实验二使用Dreamweaver创建本地站点 (2) 实验三网页编辑与超链接 (6) 【实验目的】 (6) 【实验环境】 (6) 【实验重点及难点】 (6) 【实验内容】 (6) 实验四网页图像的应用 (7) 实验五表格和布局表格 (10) 【实验目的】 (10) 【实验环境】 (10) 【实验重点及难点】 (10) 【实验内容】 (10) 实验六CSS样式的应用 (11) 【实验目的】 (11) 【实验环境】 (11) 【实验重点及难点】 (11) 【实验内容】 (11) 实验七层 (12) 实验八Dreamweaver的框架和行为 (13) 【实验目的】 (13) 【实验环境】 (13) 【实验重点及难点】 (13) 【实验内容】 (13) 实验九Dreamweaver的模版 (14) 【实验目的】 (14) 【实验环境】 (14) 【实验重点及难点】 (14) 【实验内容】 (14) 实验十Dreamweaver表单 (15) 【实验目的】 (15) 【实验环境】 (15) 【实验重点及难点】 (15) 【实验内容】 (15)

实验一HTML语言标志 【实验目的】 1.掌握的标记,和<meta>标记; 2.掌握使用<body>标记设置网页背景颜色和文本颜色。学习使用分段标记 ;3.掌握使用<font>标记设置文字的属性; 4.掌握在网页中插入背景图片; 5.掌握在网页中插入水平线,并设置水平线的属性; 6.掌握在网页中插入背景音乐。 【实验环境】 Windows xp 【实验重点及难点】 掌握字体、水平线等常用标记。 【实验内容】 1、制作一个简单的网页sy1-1.htm,用记事本编辑,内容为个人简介信息。 要求: ●搜索关键字为“个人”“主页”“简介”,标题为我的个人简介。 ●背景为#33ccff,文本颜色为黑色,文本需分段表示。 2、过记事本编辑网页sy1-2.htm,内容为李白的诗“静夜思”。 要求:每行诗为一个段落,四行文字颜色不同,字体不同。 3、通过记事本编辑网页sy1-3.htm,实现如下页面。图片自选,插入背景音乐“故乡的云.mp3”。</p><h2>简单网页制作实验总结报告</h2><p>《大学计算机基础》 实验报告 专业名称: 电子商务2班 学号: xxxxxxxxxxx 姓名: x x 指导教师: x x 2011年12月24日</p><p>目录 第一章网站主题设计说明 (1) 1.1 主题内容 (1) 1.2 设计思路 (1) 第二章网站内容设计 (2) 1.1 链接1标题 (2) 1.2 链接2标题 (2) 1.3 flash制作说明 (2) 第三章网站技术难点 (3) 第四章心得体会..................................... ..... ......................... (4)</p><p>第一章网站主题设计说明 1.1 主题内容 (1) 网站主题为“四季の花”,包括春夏秋冬四个季节的比较典型的花朵及有关花的诗句,色彩缤纷,十分艳丽夺目。 1.2 设计思路 (2) 大多网站都设计的关于音乐,影视,购物等非常热门的东西,本站设计的主题是花,能让人们在闲下来的时候看看花,品品诗歌,所以做有关花的网页是个不错的选择。同时,让人们分清楚春夏秋冬都各有什么典型的花。</p><p>第二章网站内容设计 1.1链接1标题:春の花 春天是生命的季节,在这个季节里,万物复苏。所以就找了虞美人,桃花,牡丹,以及海棠花来作为春天的代表。同时配有与这些花有关的诗句。 1.2 链接2标题:夏の花 夏天充满了激情与阳光,我找了兰花,荷花,百合花等来代表这个季节,色彩艳丽,十分醒目夺人。 1.3 链接3标题:秋の花 大丽花,菊花,月季和牡丹花都竞相出现在本网页,色彩缤纷,赏心悦目。 1.4 链接4标题:冬の花 蝴蝶兰,水仙,迎春花,梅花是冬季的代表,他们刻画了一副傲立冬天的坚强的姿态。</p><h2>网页制作实验报告</h2><p>网页制作实验报告 页制作实验报告 实验一:站点设置 一、实验目的及要求 本实例是经过“站点定义为”对话框中的“高级”选项卡创建一具新站点。 二、仪器用具 1、生均一台多媒体电脑,组建内部局域,同时接入国际互联。 2、安装windows xp操作系统;建立iis服务器环境,支持asp。 3、安装页三剑客(dreamweaver mx;flash mx;fireworks mx)等页设计软件; 三、实验原理 经过“站点定义为”对话框中的“高级”选项卡创建一具新站点。 四、实验办法与步骤 1)执行“站点\治理站点”命令,在弹出的“治理站点”对话框中单击“新建”按钮,在弹出的快捷菜单中挑选“站点”命令。 2)在弹出的“站点定义为”对话框中单击“高级”选项卡。 3)在“站点名称”文本框中输入站点名称,在“默认文件夹”文本框中挑选所创建的站点文件夹。在“默认图象文件夹”文本框中挑选存放图象的文件夹,完成后单击“确定”按钮,返回“治理站点”对话框。 4)在“治理站点”对话框中单击“完成”按钮,站点创建完毕。 五、实验结果 六、讨论与结论 实验开始之前要先建立一具根文件夹,在实验的过程中把站点存在自己建的文件夹里,如此才干使实验条理化,别至于在实验后寻别到自己的站点。在实验过程中会浮现一些选项,计算机普通会有默认的挑选,最后别要去更改,假如要更改要先充分了解清晰该选项的含义,以及它会造成的效果,否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。 实验二:页面图像设置 一、实验目的及要求: 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。 二、仪器用具 1、生均一台多媒体电脑,组建内部局域,同时接入国际互联。 2、安装windows xp操作系统;建立iis服务器环境,支持asp。 3、安装页三剑客(dreamweaver mx;flash mx;fireworks mx)等页设计软件; 4、安装acdsee、photoshop等图形处理与制作软件; 5、其他一些动画与图形处理或制作软件。 三、实验原理 设置页面的背景图像,并创建鼠标经过图像。 四、实验办法与步骤 1) 在“页面属性”对话框中设置页面的背景图像。 2) 在页面文档中单击“”插入鼠标经过图像。 五、实验结果</p><h2>个人网页制作实验报告</h2><p>湖南文理学院芙蓉学院个人主页课程设计报告 课题: 个人主页课程设计 姓名:吴珊 学号: 09120155 同组姓名:李芳 专业班级:计算机科学与技术0901班 指导教师:任盛 设计时间: 2012年6月13日</p><p>目录 1、实验目的与要求 (3) 2、主题介绍 (3) 3、工具的选择与介绍 (4) 3.1主要使用工具:Dreamweaver (4) 3.2图片处理软件:Photoshop (5) 4、网页设计实现的过程 (5) 4.1实验的分工 (5) 4.2主页的制作 (6) 4.3分页2制作(新疆美食): (7) 5、个人网站截图 (9) 6、实验总结 (11) 7、参考文献 (11) 附录: (12) 附录一(主页部分代码,有删减): (12) 附录二(分页2新疆美食部分代码,有删减):------------------- 14</p><p>1、实验目的与要求 (1)自主选择主题实现一个关于主题的个人网站 (2)使用PS、Dreamweaver等软件对界面进行设置 (3)实现网页界面的美观、内容详尽丰富。 2、主题介绍 国家的历史有长有短,疆域有大有小,实力有强有弱,人口有多有少,民族构成、宗教信仰、政权性质和经济结构也有差异,故而各国的饮食文化是不一样的。 中国饮食文化是一种广视野、深层次、多角度、高品位的悠久区域文化;是中华各族人民在100多万年的生产和生活实践中,在食源开发、食具研制、食品调理、营养保健和饮食审美等方面创造、积累并影响周边国家和世界的物质财富及精神财富。 民以食为天,中华上下五千年美食文化更是源远流长。所以这次我们选择了“美食”作为主题。美食,顾名思义就是美味的食物,贵的有山珍海味,便宜的有街边小吃。但是不是所有人对美食的标准都是一样的,其实美食是不分贵贱的,只要是自己喜欢的,就可以称之为美食。吃前有期待、吃后有回味的东西。美食遭遇心情的时候,美食已不仅仅是简单的味觉感受,更是一种精神享受。中国美食体现了中华民族的饮食文化传统,有许多独特之处。由于风味多样,四季有别。导致各地的美食各有千秋。 系因地理、气候、习俗、特产的不同形成了不同的地方风味,美食菜系的划分单就汉族的饮食特点而言,目前有四大菜系、八大菜系、十大菜系之说,而且划分系类仍有继续增加的趋势。如果按四大菜系分:有川菜、粤菜、苏菜和鲁菜。也有分八大菜系的。其中各大菜系交相辉映,各有千秋,成为了中华民族珍贵的文化瑰宝! 本次的主题分为两大部分,新疆美食、湖南美食两个主要部分。通过这两个板块来介绍两个地方的美食,以突显南北两方的美食差异与特点。让大家通过我们这个网页,以我们的网页为窗口了解湖南美食,了解新疆美食,从而增强对我国的美食文化的了解。 湖南美食-----湖南菜特别讲究原料的入味,技法多样,有烧、炒、蒸、熏等方法,尤以“蒸”菜见长。最为精湛的是煨,原汁原味。且刀功精妙,形味兼美,菜肴千姿百态,变化无穷。 新疆美食-----新疆的主食是面条、馕和牛羊肉,菜以酸辣口味为主,洋葱、番茄、辣椒、土豆用大蒜头等是常用的蔬菜配料,当然也少不了孜然、辣椒粉、醋等调味料,所以新疆菜总是香喷喷、又酸又辣,特别开胃。总地来说,新疆各民族的人们都偏爱吃面食、奶制品、牛羊肉及各种瓜果.</p><h2>网页制作实验报告6个实验</h2><p>目录 实验一网页设计基础实验 (2) 实验二HTML语言应用 (4) 实验三CSS样式表的应用---CSS的引用 (10) 实验四Dreamweaver的使用、个人网站的制作 (13) 实验五用框架、模板设计网页 (15) 实验六表单制作 (19)</p><p>实验一网页设计基础实验 一、实验目的 1.掌握网站设计的基本原则、网站及网页的基本风格与基本构图特点; 2.了解网页布局的形式。 3.用记事本编写一个简单的网页。 二、实验内容 1.上网访问实际若干电子商务网站,了解各网站的风格(主题图形形象、导航是否清晰,整体色调的搭配是否协调,主题是否突出等)。 2.在网上找出下列版面布局的结构形式: ⑴.“T”结构布局 1."T"结构布局。所谓"T"结构。就是指页面顶部为横条网站标志+广告条,下方左面为主菜单,右面显示内容的布局,因为菜单条背景教深,整体效果类似英文字母"T",所以我们称之为"T"形布局。这是网页设计中用的最广返的一种布局方式。这种布局的优点是页面结构清晰,主次分明。是初学者最容易上手的布局方法。缺点是规矩呆板,如果细节色彩上不注意,很容易让人"看之无味"。 2."口"型布局。这是一个象形的说法,就是页面一般上下各有一个广告条,左面是主菜单,右面放友情连接等,中间是主要内容。这种布局的优点是充分利用版面,信息量大(我的主页首页即属于这种布局)。缺点是页面拥挤,不够灵活。也有将四边空出,只用中间的窗口型设计,例如网易壁纸站。 3."三"型布局。这种布局多用于国外站点,国内用的不多。特点是页面上横向两条色块,将页面整体分割为四部分,色块中大多放广告条。 4.对称对比布局。顾名思义,采取左右或者上下对称的布局,一半深色,一半浅色,一般用于设计型站点。优点是视觉冲击力强,缺点是将两部分有机的结合比较困难。 5.POP布局。POP引自广告术语,就是指页面布局象一张宣传海报,以一张精美图片作为页面的设计中心。常用于时尚类站点,比如https://www.doczj.com/doc/3b7981372.html,。优点显而易见:漂亮吸引人 进入internet找到以上各种布局,并写出各种版面布局网站的域名和所采用的版面布局形式 找出使用大色块和抽象线条构图风格的网站(至少各2个);例:大色块主页 找出10个国内外著名企业或商务网站主页上的宣传标语或体现企业精神的代表性词句。 三、实验步骤与要求 1)新建一个记事本文件本在其中输入如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.doczj.com/doc/3b7981372.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="https://www.doczj.com/doc/3b7981372.html,/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>我的第一个网页

Html设计实验报告

信息职业技术学院 《网页设计》实验报告(2010—2011学年第二学期) 班级: 姓名: 学号: 指导老师:

实验一认识Dreamweaver CS3 一、实验目的 1、熟悉Dreamweaver CS3环境。 2、了解HTML文件结构。 二、实验环境 计算机 三、实验容 创建站点有两种方式:使用向导有序地进行设置,或者通过在“管理站点”对话框中设置“高级”选项卡信息来创建。无论哪种方式,都要事先在本地磁盘上建立一个用来存放站点的文件夹,这个文件夹就是本地站点的根目录。下面介绍一下这两种方式的具体操作步骤。 1.使用向导建立站点 使用向导建立站点的步骤如下:(1)打开建立站点向导的方法有3种。 ①在进入Dreamweaver的起始页界面中选择“新建”→“Dreamweaver站点”命令,如图所示。 ②选择“站点”菜单中的“新建站点”命令。 ③选择“站点”菜单中的“管理站点”命令,打开如图所示的“管理站点”对话框,执行“新建”→“站点”命令。 起始页中新建站点“管理站点”对话框(2)打开“站点定义为”对话框,在“您打算为您的站点起什么名字?”文本框中输入站点名字,如travel。若已申请域名则可以在“您的站点的HTTP地址(URL)是什么?”文本框中填入申请的域名地址。如图所示。

设置站点名和URL地址 (3)单击“下一步”按钮,询问是否使用服务器技术,如图所示。若是静态站点则选中“否,我不想使用服务器技术”单选按钮,若是动态站点可以进一步设置使用哪一种服务器技术。 选择是否使用服务器技术 (4)单击“下一步”按钮,在“您将把文件存储在计算机上的什么位置?”文本框中直接输入站点根目录的路径,或者单击“浏览”按钮,选择文件夹目录。 (5)单击“下一步”按钮,在“您如何连接到远程服务器?”下拉列表框中选择一种连接到远程服务器的方式,这里选择“无”选项。 (6)单击“下一步”按钮,将显示前几步设置的总结信息,若需修改可单击“上一步”按钮返回重新设置,若确定设置则单击“完成”按钮。 站点创建完成后将在“文件”面板中显示出站点的结构和文件。 2.使用高级设置建立站点 使用高级设置建立站点的第一步同前,在如图所示的“站点定义为”对话框中切换到“高级”选项卡,如图所示。在左边的分类中选择“本地信息”选项,然后分别设置“站点名称”、“本地根文件夹”、“默认图像文件夹”、“HTTP地址”等信息。若有需要还可以在左边的分类中选择其他项目进行设置,完成以后单击“确定”按钮,即可创建站点。 对于已经创建好的站点,可以执行编辑、复制、删除、导出和导入等操作。 1.编辑站点 如果要重新设置站点的属性,可以执行以下步骤: (1)单击“站点”→“管理站点”选项。(2)从站点列表中选择要编辑的站点名称,单击“编辑”按钮。可以参考前面创建站点的方法重新设置站点属性。(3)编辑完毕后,单击“确定”按钮,返回到“管理站点”对话框,单击“完成”按钮。 2.复制站点 如果要创建多个结构相同或相似的站点,可以利用站点的复制功能,具体步骤如下: (1)单击“站点”→“管理站点”选项。 (2)从列表中选择要复制的站点名称,单击“复制”按钮。

网页设计与制作实验报告

网页设计与制作实验指导一览表 实验1 HTML语言 实训目的: 为了让学生能熟悉学习网页不可避免要接触的HTML语言,达到用该语言可以建立一个简单的网页的目的,同时了解建立站点是做网站必不可少的,要掌握建立站点的方法。 素材准备: 准备制作网页所需的文字素材、图像素材。 实验课时: 2学时 实验内容: 1.创建站点; 2.新建网页以及保存,重命名; 3.输入HTML语言。 实验步骤:

1.在E盘中新建本地根文件夹,命名为root,并在该文件夹中新建image 文件夹以存放网站中所要用到的图片。 2.定义站点:设置 "站点名称",命名为 "mysite";设置本地根文件夹,指定 为E盘下的root文件夹;设置 "HTTP地址"为localhost。 3.创建与设置文档的页面属性:新建一个页面,保存名为“HTML基础” 的文档。 4.切换代码模式下,输入代码。 5.保存文件,预览文件效果。 实验过程注意事项: 1.在创建站点的过程中注意建立本地文件夹,文件夹命名最好为英文;网站 中所有的文件最好取名为英文;注意文件的路径; 2.所有的图片文件单独放在image文件夹内。 实验思考: 除了用HTML语言来做这个网页,还有没有其它的方法? 书写实验报告要求: 根据最终所作的网页,写出实验报告。 页面效果图: 图1-1

实验2 初识Dreamweaver 实验目的: 为了让学生能熟练掌握Dreamweaver的安装与卸载,启动与退出,基本工作环境和设置,对Dreamweaver操作环境有一定了解。 素材准备: 准备好从网上下载的安装程序。 实验课时: 2学时 实验内容: 1.安装Dreamweaver: 2.Dreamweaver的启动与退出: 3.了解工具栏、菜单栏、标题栏等工作环境: 4.卸载Dreamweaver 实验步骤: 1.打开从网上下载的Dreamweaver程序,双击安装。 2.安装完成后输入注册号。 3.启动Dreamweaver,并查看工具栏、菜单栏、标题栏等工作环境。 4.退出Dreamweaver。 5.卸载Dreamweaver 实验过程注意事项: 1.安装过程完成后,要激活。 实验思考: 从“控制面板”里删除程序与从安装到的目录文件里删除有什么区别? 书写实验报告要求: 写出本次实验报告。 实验3 文本操作

网页制作实验报告详细版

文件编号:GD/FS-4910 (报告范本系列) 网页制作实验报告详细版 The Short-Term Results Report By Individuals Or Institutions At Regular Or Irregular Times, Including Analysis, Synthesis, Innovation, Etc., Will Eventually Achieve Good Planning For The Future. 编辑:_________________ 单位:_________________ 日期:_________________

网页制作实验报告详细版 提示语:本报告文件适合使用于个人或机构组织在定时或不定时情况下进行的近期成果汇报,表达方式以叙述、说明为主,内容包含分析,综合,新意,重点等,最终实现对未来的良好规划。文档所展示内容即为所得,可在下载完成后直接进行编辑。 一、实验目的及要求 本实例是通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 二、仪器用具 1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。 2、安装windowsxp操作系统;建立iis服务器环境,支持asp。 3、安装网页三剑客(dreamweavermx;flashmx;fireworksmx)等网页设计软件; 三、实验原理

通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 四、实验方法与步骤 1)执行“站点\管理站点”命令,在弹出的“管理站点”对话框中单击“新建”按钮,在弹出的快捷菜单中选择“站点”命令。 2)在弹出的“站点定义为”对话框中单击“高级”选项卡。 3)在“站点名称”文本框中输入站点名称,在“默认文件夹”文本框中选择所创建的站点文件夹。在“默认图象文件夹”文本框中选择存放图象的文件夹,完成后单击“确定”按钮,返回“管理站点”对话框。 4)在“管理站点”对话框中单击“完成”按钮,站点创建完毕。

网页制作实验报告

网页制作实验报告 1、网站的主题说明 我的个人网站的主题是旅游,主要介绍的是日本。在我的网站中,有关于日本的景点、美食和购物的简介,提供一定的资讯信息,还有旅游的小贴士和留言板,能够与访问者互动,分享关于日本旅游的最新讯息。 2.网站的总体规划与网站的结构框图 日本的国名含义为“日出之国”。全国由北海道、四国、本洲和九洲四个大岛及几千个小岛组成,海岸线漫长曲折,境内山地崎岖、河谷交错,景色优美壮丽。 粉色樱花雨,绚烂如火的红叶,遍布岛国的绿色森林,还有漫长的美丽海岸线,都有着精致的柔美;火山地震众多,则令这些柔美脆弱而珍贵。日本前卫时尚,是匪夷所思的创意科技之国,却也是将传统文化固守得最好的国度:神社寺院的古老建筑动辄几百年历史,茶道、庭园、手工艺传承着和风之美,日式的贴心服务和国民的知书识礼,同样令人慨叹。 从东京到京都,从北海道到冲绳,每个地方都有着独特的人情风土,值得一去再去。享受美景、美食,疯狂血拼,更别忘了参加传统祭典、泡露天温泉。 因此我将网站的主题定位在甜美梦幻的风格上,附上日本经典的樱花和建筑,将日本的魅力展现在浏览者的面前。各个页面都有导航条设计、使浏览者在任意页面均可到达他想到达的景点介绍页面,增强了页面的友好程度。 网站的结构框图 3.网站LOGO 说明与各级网页风格说明 我的logo 是由图片和文字组成,可爱的小汽车表达了旅行的意愿,符合网站旅游的主题,颜色搭配也与网页的背景图片相符。为了统一便于浏览,所有的网页我采用统一的背景图片,配上简单的图片和文字,使页面简洁明了 首页

景点 美食 留言板

4.典型网页的设计过程与样例 ⑴创建站点。点击“站点”下拉菜单的“创建站点”,名字站点名称和站点在计算机的路径。 ⑵点击“文件”下拉菜单的“新建”,创建基本页面,在打开的页面中设置背景图片。 ⑶表格是非常重要的布局工具,例如首页,点击菜单栏的“插入”和“表格”,创建一个4行1列的表格,根据需要调整大小,在表格的第二行插入一个1行6列的表格作为导航,在其他表格中插入“简介”和图片。 ⑷将“首页”“景点”“美食”“购物”“旅游小贴士”“留言板”等文字键入表格后,为其设置超链接,选定文字后,在下面的属性栏中点击“链接”的文件浏览,找到相应的网页后完成超链接。 ⑸用以上的基本操作完成其他网页,并一一为导航文字设置超链接,在建设留言板的网页时,最重要的是文本域的插入,具体操作如下:插入→表单→文本域,将其放在你想设置的位置,在旁边插入按钮,插入→表单→按钮,设置“提交”和“重置”完成留言板的主体部分,插入一些图片进行美化。 ⑹最后点击浏览器进行预览和调制,F12是预览的快捷方式,完善后完成网站建设。5.提出对网站的改进意见 做好页面,并不是一件容易的事,它包括个人主页的选题、内容采集整理、图片的处理、页面的排版设置、背景及其整套网页的色调等很多东西。本次网站设计不是很好,页面过于简单,创新意识方面薄弱,链接方面只有二级页面,内容不够丰富,这是我需要提高的地方。需要学的地方还有很多,需要有耐心、坚持,不断的学习,综合运用多种知识,才能设计出好的web页面。

网页制作实验报告格式

网页制作实验报告格式 实验一:站点设置 一、实验目的及要求 本实例是经过站点定义为对话框中的高级选项卡创建一具新站点。 二、仪器用具 1、生均一台多媒体电脑,组建内部局域,同时接入国际互联。 2、安装windows xp操作系统;建立iis服务器环境,支持asp。 3、安装页三剑客(dreamweaver mx;flash mx;fireworks mx)等页设计软件; 三、实验原理 经过站点定义为对话框中的高级选项卡创建一具新站点。 四、实验办法与步骤 1)执行站点治理站点命令,在弹出的治理站点对话框中单击新建按钮,在弹出的快捷菜单中挑选站点命令。 2)在弹出的站点定义为对话框中单击高级选项卡。 3)在站点名称文本框中输入站点名称,在默认文件夹文本框中挑选所创建的站点文件夹。在默认图象文件夹文本框中挑选存放图象的文件夹,完成后单击确定按钮,返回治理站点对话框。 4)在治理站点对话框中单击完成按钮,站点创建完毕。 五、实验结果 六、讨论与结论 实验开始之前要先建立一具根文件夹,在实验的过程中把站点存在自己建的文件夹里,如此才干使实验条理化,别至于在实验后寻别到自己的站点。在实验过程中会浮现一些选项,计算机普通会有默认的挑选,最后别要去更改,假如要更改要先充分了解清晰该选项的含义,以及它会造成的效果,否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。 实验二:页面图像设置 一、实验目的及要求: 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。 二、仪器用具 1、生均一台多媒体电脑,组建内部局域,同时接入国际互联。 2、安装windows xp操作系统;建立iis服务器环境,支持asp。 3、安装页三剑客(dreamweaver mx;flash mx;fireworks mx)等页设计软件; 4、安装acdsee、photoshop等图形处理与制作软件; 5、其他一些动画与图形处理或制作软件。 三、实验原理 设置页面的背景图像,并创建鼠标经过图像。 四、实验办法与步骤 1) 在页面属性对话框中设置页面的背景图像。 2) 在页面文档中单击插入鼠标经过图像。 五、实验结果 六、讨论与结论 实验结束后我们能够看到页面的背景变成了我们插入的图像,同时要鼠标经过的时候会变成另一具图像,这算是鼠标经过图像的效果。固然这种实验效果很难在实验结果的截图里

网页设计与制作实训报告

机电职业技术学院网页设计与制作 实训报告 专业计算机信息管理 班级G093501 姓名雪曼 指导老师郭建明

2011-5-21 一、实训目的 1、进一步熟悉和掌握建设的基本流程和技术规; 2、巩固运用Dreamweaver网页制作软件制作网页、特别是制作复杂网页的知识; 3、巩固运用PS图像处理软件进行网页中图形制作和运用flash动画制作软件设计网页中动画的知识; 4、巩固综合运用Dreamweaver、PS、flash三个软件完成建设任务的方法,能独立设计一个容完整、图文并茂、技术运用得当的; 5、在网页设计的实践中培养分析问题、解决问题的能力,培养协作、交流的能力,培养创新能力和团队意识; 7、紧紧围绕网页制作的流程:规划、设计、开发、发布、维护来进行的开发,制作出具有较高水准的静态网页。以此作为学生学习这门课程的阶段性总结,使学生复习、巩固所学过的理论,并予以适当的深化,进一步训练学生的基本技能(如:搜集资料、整理数据、制表绘图、发现与分析问题、寻求解决问题的方案等),为今后从事开发、维护和管理奠定基础。 二、实训项目 旅游的建设 三、实训过程 1.资料的搜集。 2.熟悉制作软件。

3.构建站点框架。 打开Dremweaver后步便是新建站点 4设计主页及二级页面。 5实现网页间的 的过程其实很简单,主要是把要的文字选择在选择工具栏的按钮最后选择自己要的网页单击确定便可以了。 6向静太网页插入动态效果 具体情况如下: 通过这半年的学习实践中和老师的指导下以大量明晰的操作步骤和典型的应用实例,教会我们。使更丰富全面的软件技术和应用技巧,使我们真正对所学的软件融会贯通。所以我结合所学专业的容制作了个人,作为实习的成果。其容是多样化的。制作网页用的软件是Dreamweaver , banner软件。Dreamweaver 大大加速了网络时代电子交易应用中的项目交付。它提供了网页和表单的动态生成到企业级的解决方案,如电子商店,库存管理系统和企业部局域网的数据库应用等功能。例如,网页上很流行的阴影和立体按纽等效果,只需单击一下就可以制作完成。当然,其最方便之处是,它可以将图象切割,图象映射,悬停按纽,图象翻转等效果直接生成HTML代码,或者嵌入到现有的网页中,或者作为单独的网页出现。主图是一个网页的门面,它能体现出这个网页的整体风格。 制作网页,首先是确定主题,经过再三考虑,就做了个关于的旅游,平时也总是浏览类似的,对这些还有些了解,于是确定主题,做一些类似的,但考虑到,现在网络上好多类似的,但有些容比较复杂,对于我们来说有点不实际,根据这种情况,最后决定建立一个简单的旅游,于是主题确立。

Html设计实验报告

山东信息职业技术学院 《网页设计》实验报告(2010—2011学年第二学期) 班级: 姓名: 学号: 指导老师:

实验一认识Dreamweaver CS3 一、实验目的 1、熟悉Dreamweaver CS3环境。 2、了解HTML文件结构。 二、实验环境 计算机 三、实验内容 创建站点有两种方式:使用向导有序地进行设置,或者通过在“管理站点”对话框中设置“高级”选项卡信息来创建。无论哪种方式,都要事先在本地磁盘上建立一个用来存放站点的文件夹,这个文件夹就是本地站点的根目录。下面介绍一下这两种方式的具体操作步骤。 1.使用向导建立站点 使用向导建立站点的步骤如下:(1)打开建立站点向导的方法有3种。 ①在进入Dreamweaver的起始页界面中选择“新建”→“Dreamweaver站点”命令,如图所示。 ②选择“站点”菜单中的“新建站点”命令。 ③选择“站点”菜单中的“管理站点”命令,打开如图所示的“管理站点”对话框,执行“新建”→“站点”命令。 起始页中新建站点“管理站点”对话框(2)打开“站点定义为”对话框,在“您打算为您的站点起什么名字”文本框中输入站点名字,如travel。若已申请域名则可以在“您的站点的HTTP地址(URL)是什么”文本框中填入申请的域名地址。如图所示。 设置站点名和URL地址

(3)单击“下一步”按钮,询问是否使用服务器技术,如图所示。若是静态站点则选中“否,我不想使用服务器技术”单选按钮,若是动态站点可以进一步设置使用哪一种服务器技术。 选择是否使用服务器技术 (4)单击“下一步”按钮,在“您将把文件存储在计算机上的什么位置”文本框中直接输入站点根目录的路径,或者单击“浏览”按钮,选择文件夹目录。 (5)单击“下一步”按钮,在“您如何连接到远程服务器”下拉列表框中选择一种连接到远程服务器的方式,这里选择“无”选项。 (6)单击“下一步”按钮,将显示前几步设置的总结信息,若需修改可单击“上一步”按钮返回重新设置,若确定设置则单击“完成”按钮。 站点创建完成后将在“文件”面板中显示出站点的结构和文件。 2.使用高级设置建立站点 使用高级设置建立站点的第一步同前,在如图所示的“站点定义为”对话框中切换到“高级”选项卡,如图所示。在左边的分类中选择“本地信息”选项,然后分别设置“站点名称”、“本地根文件夹”、“默认图像文件夹”、“HTTP地址”等信息。若有需要还可以在左边的分类中选择其他项目进行设置,完成以后单击“确定”按钮,即可创建站点。 对于已经创建好的站点,可以执行编辑、复制、删除、导出和导入等操作。 1.编辑站点 如果要重新设置站点的属性,可以执行以下步骤: (1)单击“站点”→“管理站点”选项。(2)从站点列表中选择要编辑的站点名称,单击“编辑”按钮。可以参考前面创建站点的方法重新设置站点属性。(3)编辑完毕后,单击“确定”按钮,返回到“管理站点”对话框,单击“完成”按钮。 2.复制站点 如果要创建多个结构相同或相似的站点,可以利用站点的复制功能,具体步骤如下: (1)单击“站点”→“管理站点”选项。 (2)从列表中选择要复制的站点名称,单击“复制”按钮。 (3)若要对复制的站点进行编辑,可以从站点列表中选中新复制的站点,单击“编辑”按钮,编辑完成返回到“管理站点”对话框,单击“完成”按钮。

网页制作实验报告

网页制作实验报告 网页制作实验报告 实验一:站点设置sp; 一、实验目的及要求sp; 本实例是通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。sp; 二、仪器用具sp; 1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。sp; 2、安装windowssp;xp操作系统;建立iis服务器环境,支持asp。sp; 3、安装网页三剑客(dreamweaversp;mx;flashsp;mx;fireworkssp;mx)等网页设计软件;sp; 三、实验原理sp; 通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。sp; 四、实验方法与步骤sp; 1)执行“站点\管理站点”命令,在弹出的“管理站点”对话框中单击“新建”按钮,在弹出的快捷菜单中选择“站点”命令。sp; 2)在弹出的“站点定义为”对话框中单击“高级”选项卡。sp; 3)在“站点名称”文本框中输入站点名称,在“默认文件夹”文本框中选择所创建的站点文件夹。在“默认图象文件夹”文本框中选择存放图象的文件夹,完成后单击“确定”按钮,返回“管理站点”对话框。sp;

4)在“管理站点”对话框中单击“完成”按钮,站点创建完毕。sp; 五、实验结果sp; 六、讨论与结论sp; 实验开始之前要先建立一个根文件夹,在实验的过程中把站点存在自己建的文件夹里,这样才能使实验条理化,不至于在实验后找不到自己的站点。在实验过程中会出现一些选项,计算机一般会有默认的选择,最后不要去更改,如果要更改要先充分了解清楚该选项的含义,以及它会造成的效果,否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。sp; sp; 实验二:页面图像设置sp; 一、实验目的及要求:sp; 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。sp; 二、仪器用具sp; 1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。sp; 2、安装windowssp;xp操作系统;建立iis服务器环境,支持asp。sp; 3、安装网页三剑客(dreamweaversp;mx;flashsp;mx;fireworkssp;mx)等网页设计软件;sp; 4、安装acdsee、photoshop等图形处理与制作软件;sp; 5、其他一些动画与图形处理或制作软件。sp; 三、实验原理sp;

网页设计实验报告

《网络程序设计》 实验报告 学院:信息工程学院 专业:电子信息工程专业 学期:2014~2015学年第二学期 学号: 姓名:

实验1 使用JSP编写网页程序 1.1 实验目的 1.熟悉MyEclipse开发环境。 2.熟悉JSP基本语法。 3.练习使用JSP脚本语句。 4.熟练运用JSP内置对象。 1.2 实验预习 1.安装MyEclipse。 本实验使用的版本是10.7-offline-installer-windows 32位版。安装时默认路径在“使用用户\AppData\Local\”,可以自行更改。 2.了解java开发环境的配置。 1.3 实验任务 1.启动MyEclipse程序,并将启动界面截图。 2.启动tomcat服务器,并将启动状态信息截图。 配置window->Preferences->Tomcat。设MyEdipse T omcat 6为不可用并将Tomcat 5.X

server设为可用,选择路径为apache-tomcat-5.5.27的所在路径。 3.编写第一个JSP网页程序,在JSP页面中嵌入脚本代码,通过内置对象out在页面中打印出“Hello My First JSP Page”。 新建一个project,其中Web Service Project,Report Web Project都可用,就目前来说区别不大。在index.jsp文件内编写代码。其文件内结构如下: 语言参数,调用头文件 //文件开始标签 //文件头部标签 <tltie> //文件标题标签 <head> // <body> //文件主体标签 Hello My First JSP Page. <br> //网页显示内容 <body> <html></p><h2>网页制作实验报告</h2><p>实验系网站的制作 一。实验目的 1)掌握HTML语法基本的基本用法; 2)熟悉HTML编写网页的方法; 3)熟悉dreamweaver8界面及操作; 4)熟悉使用dreamweaver8建立站点及制作网页; 5)熟悉photoshop的用法; 6)用自己所学的软件,以系网站的内容为参考,制作出有自己风格的系网站 7)掌握创建网页的方法; 8)掌握网页的编辑,包括图片的插入、动态效果、背景图片的的项操作。 9)掌握超链接的创建与编辑。 二,实验基本原理 (1)Photoshop是一个著名的图像处理理软件之一,集图像扫描、编辑修改、图像制作、广告创意,图像输入与输出于一体的图形图像处理软件,具有强大的图像 修饰功能,利用这些功能可进行网页背景图像的制作,修复。 (2)Dreamweaver8 是一款专业的HTML编辑器,用于对WEB 页和WEB应用程序进行设计,编码和开发。无论直接编写HTML代码还是在可视图化编辑环境中工作, dreamweaver8 都会提供很多快捷的工具。Dreamweaver8 是可以完全自定义的, 可以使用它创建自己的对象和命令,修改快捷键,也可以编写JAVAScript 代码, 从而用自己创建的新行为,属性检查器和站点报告来扩展 dreamweaver 的功 能。 三,实验准备 (1)在电脑上安装photoshop cs4及Dreamweaver8; (2)收集一些关于学校的图片,以及一些其他的风景图片。 四,实验内容 (一),网站名称:电子工程系 (二),网页设计的大体结构</p><p>主要是对主页进行设计,其结构图大体如下: 五,设计规划 (一)画图 (1)打开photoshop设置主体布局,将本次的布局为“三”字型布局 (2)利用photoshop画图,打开photoshop,导入一张自己认为可做网页背景的图片; (3)用photoshop里面的工具对背景图片做适当的编辑修改,调色; (4)制作文字标志将图片和文字组合,将具有本系特色的logo绘制在顶端; (5)利用圆角矩形工具和颜色渐变工具制作网站主页导航条,及其他导航条 (6)制作栏目内容; (7)在图片下方制作版权区域;</p><h2>《网页设计与制作》实验报告</h2><p>《网页设计与制作》实验报告院系名称:专业班级:电 学生姓名:学号: 2013年 5 月26 日</p><p>实验一:HTML语言实验 一、实验目的 1、掌握利用HTML语言编写网页的能力; 2、掌握利用HTML语言编写表格的能力; 3、掌握利用HTML语言编写表单的能力。 二、实验课时 2学时 三、实验内容 1、表格实验的结果。 ①表格制作代码: <HTML> <HEAD> <TITLE>制作网页表格

A BC
D
E F G H
I
②网页表格制作截图:

2、表单实验的结果 ①表单实验代码: 实验1.2——电子商务1104王远

文本预览
姓名:
密码:
性别:
爱好: 篮球 足球 乒乓球
籍贯: