电子商务师知识电子书.doc
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_05.gif)
《电子商务师知识电子书.doc》由会员分享,可在线阅读,更多相关《电子商务师知识电子书.doc(222页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、【精品文档】如有侵权,请联系网站删除,仅供学习与交流电子商务师知识电子书.精品文档.第一章 网页制作第一节 HTML语言一、 页面布局学习目标(1)了解HTML超文本标记语言的结构、语法。(2)掌握HTML文件的建立及浏览、常用格式化标记符的位置。(3)掌握链接标记的设置。工作程序及内容(一) 建立HTML文件操作步骤如下:单击“开始”按钮,选择“程序”“附件”“记事本”,并打开“记事本”窗口。(1) 在记事本中,输入如图1-1所示的HTML语句。 我的花店 欢迎您访问我的花店! 图1-1 在记事本中输入HTML语句(2) 执行“文件”“保存”命令,将文件保存为1-1.htm。(3) 在浏览器
2、中打开所建立的HTML文件,效果如图1-2所示。说明:除了记事本之外,还可以使用写字板或其他文本编辑软件来编辑HTML文件。(二) 常用的HTML标记设置 操作步骤如下:(1) 在文本文件编辑中编写HTML文件(可参考下面的示例编写)。(2) 保存HTML文件。(3) 在浏览器中预览所编辑的HTML文件的效果。1标题标记 【示例1】标题标记,在记事本中输入以下HTML语句,保存后浏览效果,如图1-3所示。 我的花店 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店! 欢迎您访问我的花店!欢迎您
3、访问我的花店!欢迎您访问我的花店!欢迎您访问我的花店!欢迎您访问我的花店!欢迎您访问我的花店!图1-3标题标记浏览效果标记符用于定义段落标题的大小级数。最大的标题级数是,最小的标题级数是。使用标记符的align属性可控制文字的对齐方式,属性值可以是left(左对齐)、center(居中对齐)或者right(右对齐)。2.段落标记符 【示例2】段落标记符,输入HTML语句如下,保存后的浏览效果如图1-4所示。我的花店我的花店欢迎您访问我的花店!花可以传情,可表达思念之情,亲情,感恩的心情,衷心的祝福!祝愿进入我的花店的朋友天天有好心情!版权归“我的花店”所有我的花店欢迎您访问我的花店!花可以传情
4、,可表达思念之情,亲情,感恩的心情,衷心的祝福!祝愿进入我的花店的朋友天天有好心情!版权归“我的花店”所有图1-4 段落标记标记符用于划分段落,控制文本的位置。是成对标记符,用于定义内容从新的一行开始,并与上段之间有一个空行,其align属性定义新开始的一行内容在页面中的对其位置,属性值可以是eft(左对齐)、center(居中对齐)或者right(右对齐)。3换行标记【示例3】换行标记,将示例2中相应段落中的段落标记替换为换行标记,HTML语句如下,保存后的浏览效果如图1-5所示。注意段落标记和换行标记预览效果的不同。我的花店我的花店欢迎您访问我的花店!花可以传情,可表达思念之情,亲情,感恩
5、的心情,衷心的祝福!居室之内,放上一束瓶插花,可以增添幽雅、清净、舒适之感。祝愿进入我的花店的朋友天天有好心情!版权归“我的花店”所有我的花店欢迎您访问我的花店!花可以传情,可表达思念之情,亲情,感恩的心情,衷心的祝福!居室之内,放上一束瓶插花,可以增添幽雅、清净、舒适之感。祝愿进入我的花店的朋友天天有好心情!版权归“我的花店”所有图1-5换行标记标记符用于定义文本从新的一行显示,它不产生一个空行,但连续多个标记符可以产生多个空行的效果。是非成对标记符。注意与段落标记符的区别。4.列表标记【示例4】项目列表标记,HTML语句如下,保存后的浏览效果如图1-6所示。花语花语各种花所代表的含义如下:
6、 玫瑰:纯洁的爱 剑兰:用心坚固 百合:百年好和 满天星:爱怜菊花:吉祥康乃馨:亲情思念郁金香:爱的表白紫罗兰:永恒之美勿忘我:爱到永恒列表标记包括“项目列表”标记、“编号列表”标记。和标记都是成对标记。在标记之间还可以使用标记来设定项目内容,其type属性可以显示不同形状的项目符号,取值有:1不加type属性。项目符号显示为(默认值2 type=”circle”。项目符号显示为3 type=”square”。项目符号显示为链接标记的设置链接标记,输入如下所示的HTML语句,保存后的浏览器效果如图所示花语花节友情链接与我联系HTML是通过标记符来实现超链接的,它是成对标记符,主要属性有:1 h
7、ref,链接文件的地址2 target 链接目标的位置指向电子邮件的链接与我联系指向站点内的文件链接花节指向其他网站文件的链接友情链接(一) html文件的概念html,即超文本标记语言,他通过多种标准化的标记符号(tag)对网页超媒体内容的输出格式以及个内容部分之间逻辑上的组织关系进行描述和制定(二)html文件的特点Html是web页面的基础。使用html描述网页文件称之为html页面或者html文件,这种文件以“.html”或者“.htm”为扩展名,它是一种纯文本文件,可以使用记事本,写字板等文本编辑器来进行编辑,它可以使用Frontpage、Dreamweaver等网页制作工具来快速创
8、建html文件(三)html文件的结构Html文件均以标记符开始,以标记符结束。和标记符之间的内容用于描述页面的头部信息,例如页面标题、关键词等信息。在和标记符间的内容即为页面的主体内容。Html文件的整体结构如图所示(四)绝对地址和相对地址文件引用既可以使用绝对地址,也可以使用相对地址绝对地址直接写出所连接的文件位于哪个服务器中的网站内,主要是用来链接当前网站中的其他网页注意事项:在使用记事本等编辑器建立html文件时,一定要以.htm或.html为扩展名保存文件,否则在浏览器中无法正确显示预览效果()建立html文件操作步骤如下1单机“开始”按钮,选择“程序”到“附件”到“记事本”,打开“
9、记事本”窗口2在记事本中输入html语句3执行“文件”到“保存”命令将文件保存为htm或html4在浏览器中预览所建立的html文件(二)标记的位置我的花店我的花店欢迎您访问我的花店!花可以传情,也可以表达思念之情,亲情,感恩的心情,忠心的祝福!居室之内,放上一束瓶插花,可增添优雅、清静、舒适之感。祝愿进入我的花店的朋友天天都有好心情!版权归“我的花店”所有标记用来定义文字的字体、大小和颜色,成对标记符。主要属性:1 face属性:定义文字所用的字体,如face=隶书2 size属性:定义文字大小,属性值为17,也可以使用相对大小来设置,如size=“5”、size=“-5”3 color属性
10、。定义文字的颜色,可以使用颜色的英文名称来表示颜色,如:葱“red”:也可以使用16进制的RGB代码来表示颜色,color=“#FFFF99”,在使用16进制的RGB代码来表示颜色时,需要颜色代码前加“#”此外,字体间标记还包括粗体标记符、标记符等(三)表格标记的设置表格标记,在记事本中输入以下html语句,保存后在浏览器中浏览,效果如图所示花束节日名称5月1日国际劳动节4日中国青年节tr align=”center” 12日护士节 6/月1日国际儿童节+- 在和之间放置表格内容,标记是成对标记。在表格中,行是用标记来定义的,一行使用一个标记,每行中的列是用标记定义的;一列使用一个标记。、标记
11、符都有相应的属性,用来定义表格中内容的显示方式。表格标记的主要属性有:- (1)rowspan。定义该单元格所跨行数。- (2)colspan。定义该单元格所跨列数。相关知识(一) HTML标记的格式HEML文件的所有控制语句称为标记,标记在一对尖括号之间,格式如下:HTML语言元素(1) 标记符分为成对标记符和非成对标记符,、等属于成对标记符,、等属于非成对标记符。标记符忽略大小写。HTML源文件为文本文件,多个标记符可写成一行,甚至整个文件可写成一行;一个标记符的内容可以写成多行。(2) 可使用标记符的属性来进一步限定标记符,一个标记可以有多个属性项,各个属性项的次序不限定,各数性项间用空
12、格进行分隔。(3) HTML中使用的注释语句为,注释内容可插入文本中任何位置,注释内容将不显示。(二) HTML的作用(1) 利用标题、文本、表格、列表和图像发布在线信息。(2) 应用超链接获取世界各地的在线信息。(3) 应用表单与远程服务通信,实现信息查询及各种商贸活动。注意事项表格是用.行标记符来一行一行定义的,每行中用.列标记符来定义各列。思考与练习1. HTML文件中的标记是否区分大小写?2. 编辑HTML文件时应注意什么问题?3. 试用HTML编写一个简单的表格网页。第二节 动态网页制作一、 编辑图像学习目标(1) 了解动态网页、图像处理的有关知识。(2) 掌握使用Photoshop
13、编辑和处理图像方法。(3) 掌握DHTML的应用。工作程序及内容(一) 编辑图像【示例8】在FrontPaga中利用横幅广告管理器组件插入横幅广告。横幅广告中的图片尺寸应尽量一致,为此需要利用图像编辑处理软件对图像进行适当的处理。我们以Photoshop工具为例进行介绍,对图片进行适当的处理,图片大小设置为200100像素,操作步骤如下:(1) 单击“开始”按钮,选择“程序”“Adobe Photoshop7.0”打开Photoshop工作窗口,如图1-11所示。(2) 在Photoshop工作窗口中执行“文件”“打开”命令、打开图像文件,然后执行“图像”“图像大小”命令,在弹出的“图像大小”
14、对话框中将图像的宽度设置为200像素,高度设置为100像素,如图1-12所示,单击“好”按钮。(3) 对图像应用滤镜效果。执行“滤镜”“风格化”“风”命令,在弹出的“风”对话框中进行参数设置,如图1-13所示,单击“好”按钮。(4) 保存图像。执行“文件”“存储为”命令,在弹出的“存储为”对话框中设置保存路径、文件名称及文件的类型,如图1-14所示。单击“保存”按钮,会弹出如图1-15所示的“JPEG”选项对话框,进行品质等设置后单击“好”按钮,完成文件的保存操作。(5) 按照上述方法,再打开两幅图像文件,调整图像大小为200100像素,并分别应用“水波”、“动感模糊”效果,参数设置如图1-1
15、6所示,最后保存图像文件。(二)在FrontPage中插入横幅广告操作步骤如下:(1)单击“开始”按钮,选择“程序”“Microsoft FrontPage”,打开“Microsoft FrontPage窗口,执行“文件”“保存文件”命令,将新建文件保存为guanggao.htm。(2)在FrontPage中执行“插入”“组件”“横幅广告管理器”命令,打开“横幅广告管理器属性”对话框,设置宽度为200,高度为100,过渡效果为“分解”,每幅图片显示3妙,单击“添加”按钮,将所需要的图片添加到“图片显示”列表框中,单击“上移”、“下移”按钮调整横幅广告图像变换的次序,然后点击确定。(三)在Fro
16、ntPage中应用动态HTML效果【示例9】在FrontPage中应用动态HTML效果,操作步骤如下:(1)单击“开始”按钮,选择“程序”“Microsoft FrontPage”,打开“Microsoft FrontPage”窗口,执行“文件”“保存文件”命令,将新建文件保存为dtsg.htm。(2)在FrontPage窗口中输入文本“助理电子商务师”,然后选中文本执行“格式”“动态HTML效果”命令,在出现的“DHTML效果”工具栏中进行设置,(3)保存后在浏览器中进行预览,当鼠标放置文本上时,黑色无边框的文本变为如图效果。(四)建立及应用CSS样式文件【示例10】使用FrontPage建
17、立名为mystyle.css的外部CSS样式文件,并在其他页面文件中应用此样式文件。1、创建CSS样式文件(1)单击“开始”按钮,选择“程序”“Microsoft FrontPage”,打开“Microsoft FrontPage”窗口。(2)在FrontPage 窗口中,选择“文件”“新建”“网页”,在“新建”对话框中单击“样式表”选项卡,选择要创建的样式类型,然后确定。(3)单击样式工具栏中的样式按钮,(4)单击“样式”对话框中的“新建”按钮,弹出“新样式”对话框,在“名称”(选择器)中输入样式名称,单击“格式按钮进行字体、段落、边框等设置。(5)单击确定按钮后,会在样式对话框的样式栏中显
18、示用户自定义的样式。再单击“确定”按钮,完成样式文件的创建,(6)执行文件、保存文件 命令 ,以 mystyle.css名称进行保存。2、应用外部CSS样式操作步骤如下(1)新建页面文件并进行保存操作,输入文字内容“这是样式的应用”(2)执行“格式 ”样式表链接 命令,在打开的 链接样式表 对话框 中进行设置,选择 所选的网页 选项,单击 添加 按钮选择 所需要 链接的样式表文件mystyle.css,(3)选中文字“这是样式的应用”切换到HTML视图下,将区中的保存文件后浏览效果,大多树时候可以不为具体的HTML标记符定义格式,而是定义一些开放的格式,在内容需要的时候才引用这些格式。例如,在
19、mystyle.css文件中定义了一个类样式test,区中的段落标记中应用了这个类样式。(一)DHTML1.DHTML的定义DHTML(Dynamic HTML)又称动态网页,它将内容对象化,应用编程语言来操作页面上的对象,不必通过服务器就可以与用户互信息,更新页面的内容。动态网页技术包括JavaScript、VBScript、css(层叠样式表)、Layers(层)等。传统的HTML页面一旦被下载到客户端浏览器后,就无法改变显示内容,因此被称为静态网页。2、DHTML的基本结构DHTML的基本结构包括HTML、CSS、脚本程序、浏览器对象和网页对象等。DHTML是基于HTML语言,通过CSS
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 电子 商务师 知识 电子书
![提示](https://www.taowenge.com/images/bang_tan.gif)
限制150内