助理电子商务师教程国家职业资格三级第一章:网页制作第一节:HTML语言第二节动态网页制作第二章:网络商务信息收集与交换第一节网络商务信息采集第二节网络商务信息处理第三章:网络营销第一节网上市场调研第二节网络广告与促销第四章:电子交易第二节电子合同签订第五章:物流信息管理第一节物流信息收集与分析第二节物流信息的应用第六章:网络采购第一节采购业务流程编制第二节供应商管理第七章:电子商务安全管理第一节文件加密第二节交易安全管理第三节安全工具使用第一章网页制作第一节HTML语言一、页面布局二、文字与表格第二节动态网页制作一、编辑图像二、视频与音频第一节HTML语言一、页面布局学习目标:(1)了解HTML超文本标记语言的结构、语法。(2)掌握HTML文件的建立及浏览、常用格式化标记符的设置。(3)掌握链接标记的设置。工作程序及内容:(一)建立HTML文件操作步骤如下:(1)单击“开始”按钮,选择“程序”→“附件”→“记事本”,并打开“记事本”窗口。(2)在记事本中,输入如图所示的HTML语句。(3)执行“文件”→“保存”命令,将文件保存为1-1.htm。(4)在浏览器中打开所建立的HTML文件。说明:除了记事本之外,还可以使用写字板来编辑html.(二)常用的HTML标记设置操作步骤如下:(1)在文本文件编辑器中编写HTML文件(可参考下面的示例编写)。(2)保存HTML文件。(3)在浏览器中预览所编辑的HTML文件效果。1.Hi标题标记[示例1]标题标记,在记事本中输入以下HTML语句,保存后浏览效果,如图所示。htmlheadtitle我的花店/title/headbodyh1欢迎你访问我的花店!/h1h2欢迎你访问我的花店!/h2h3欢迎你访问我的花店!/h3h4欢迎你访问我的花店!/h4h5欢迎你访问我的花店!/h5h6欢迎你访问我的花店!/h6h7欢迎你访问我的花店!/h7/body/html说明:hi标记符用于定义段落标题的大小级数。最大的标题级数是h1,最小的标题级数是h6。使用hi标记符的align属性可控制文字的对齐方式,属性值可以是left(左对齐),center(居中对齐),或者right(右对齐)。2.P段落标记符[示例2]段落标记符,输入HTML语句如下,保存后的浏览效果如图所示。htmlheadtitle我的花店/title/headbodybgcolor=#FFFF99h1align=center我的花店!/h1palign=center欢迎您访问我的花店/ppalign=“center”花可以传情,可表达思念之情,亲情,感恩的心情,衷心的祝福!/ppalign=center祝愿进入我的花店的朋友天天有好心情!/p/body/html说明:P标记符用于划分段落,控制文本的位置。P是成对标记符,用于定义内容从新的一行开始,并与上段之间的一个空行,其align属性定义新开始的一行内容在页面中的对齐位置,属性值可以是left(左对齐),center(居中对齐),或者right(右对齐)。3.br换行标记[示例3]换行标记,将示例2中相应段落中的段落标记P替换为换行标记br,HTML语句如下,保存后的浏览效果如图所示。注意段落标记P和换行标记br预览效果的不同。htmlheadtitle我的花店/title/headbodybgcolor=#FFFF99h1align=center我的花店!/h1hralign=centerwidth=100%size=4color=3333FFpalign=center欢迎您访问我的花店/p花可以传情,可表达思念之情,亲情,感恩的心情,衷心的祝福!br祝愿进入我的花店的朋友天天有好心情!brhralign=centerwidth=100%size=4color=3333FF/body/html说明:br标记符用于定义从新的一行显示,它不产生一个空行,但连续多个br标记可以产生多个空行的效果。br标记符是非成对标记符。4.列表标记[示例4]项目列表标记,HTML语句如下,保存后的浏览效果如图。headhtmltitle花语/title/headbodybgcolor=#FFFF99hlalign=centerfontface=宋体花语/font/hlp各种花所代表的含义如下:/pulli玫瑰:纯洁的爱/lili剑兰:用心坚固/lili百合:百年好和/lilitype=circle满天星:爱怜/lilitype=circle菊花:吉祥/lilitype=circle康及馨:亲情思念/lilitype=circle郁金香:爱的表白/lilitype=circle紫罗兰:永恒之美/lilitype=circle勿忘我:爱到永远/li/ul/body/html列表标记包括“项目列表”标记ul、“编号列表”标记ol。ul和ol标记都是成对标记。在ul标记之间还可以使用li标记来设定项目内容,其type属性可以显示不同形状的项目符号。(三)a链接标记的设置[示例5]链接标记,输入如下所示的HTML语句,保存后的浏览效果如图所示。htmlhead/headbodybgcolor=#FFFF99pahref=1-7.htm花语/a/ppahref=bg.htmtarget=right花节/a/ppahref=友情链接/a/ppahref=mailto:gltxiaohong@buu.com.cn与我联系/a/p/body/htmlHTML是通过a标记符来实际超链接的,它是成对标记符,主要属性有:(1)href。链接文件的地址。(2)target。链接目标的位置。1.指向电子邮件的链接ahref=mailto:gltxiaohong@buu.com.cn与我联系/a2.指向站点内文件的链接ahref=bg.htmtarget=right花节/a3.指向其他网站文件的链接ahref=友情链接/a相关知识(一)HTML文件的概念HTML(HyperTextMarkupLanguafe),即超文本标记语言,它通过多种标准化的标记符号(Tag)对网页内容进行标注,对页面内容进行标注,对页面超媒体内容的输出格式以及各内容部分之间逻辑上的组织关系等进行描述和指定。(二)HTML文件的特点HTML是Web页面的基础。使用HTML描述的网页文件称之为HTML页面或者HTML文件,这种文件以“.html”或者“.htm”为扩展名,它是一种纯文本文件,可以使用记事本、写字板等文本编辑器来进行编辑,也可以使用FrontPage、DreamWeaver等网页制作工具来快速创建HTML文件。(三)HTML文件的结构HTML文件均以html标记符开始,以/html标记符结束。head和/head标记符之间的内容用于描述页面的头部信息,例如页面标题、关键词等信息。在body和/body标记符之间的内容即为页面的主体内容。HTML文件的整体结构如图所示。(四)绝对地址和相对地址文件的引用既可以使用绝对地址,也可以使用相对地址。1.绝对地址直接定出所链接的文件位于哪个服务器中的网站内,主要用来链接其他网站的网页,例如:ahref=友情链接/a2.相对地址用所链接的文件相对于目前网页所在位置来表示,通常用来链接当前网站中的其他网页,例如:ahref=bg.htmtarget=right花节/a注意事项在使用记事本等编辑器建立HTML文件时,一定要以.htm.或html为扩展名保存文件否则在浏览器中无法正确显示预览效果。二、文字与表格学习目标(1)进一步了解HTML超文本标记语言的结构、语法。(2)掌握字体标记符、表格标记符的设置。工作程序和内容(一)建立HTML文件操作步骤如下:(1)单击“开始”按钮,选择“程序”→“附件”→“记事本”,打开“记事本”窗口。(2)在记事本中输入HTML语句。(3)执行“文件”→“保存”命令,将文件保存为htm或html格式。(4)在浏览器中预览所建立的HTML文件(二)font标记的设置[示例6]字体标记,设置示例2中相应段落的字体,HTML语句如下,保存后浏览效果,如图所示。headtitle我的花店/title/headbodybgcolor=#FFFF99h1align=centerbfontcolor=#FF0000face=隶书size=+5我的花店!花店/font/b/h1hralign=centerwidth=100%size=4color=3333FFpalign=center欢迎您访问我的花店/p花可以传情,可表达思念之情,亲情,感恩的心情,衷心的祝福!br祝愿进入我的花店的朋友天天有好心情!brhralign=centerwidth=100%size=4color=3333FF/body/htmlfont标记用来定义文字的字体、大小和颜色,是成对标记符。主要属性有:(1)face属性:定义文字所使用的字体,如face=“隶书”。(2)size属性:定义文字的大小,属性值为1~7,也可以使用相对大小来设置,如size=“+5”、size=“-5”。(3)color属性。定义文字的颜色,可以使用颜色的英文名称来表示颜色,如:color=“red”;也可使用16进制的RGB代码来表示颜色,color=“#FF0000”,在使用16进制的RGB代码来表示颜色时,需在颜色代码前加“#”。此外,字体标记符还包括b…/b粗体标记符、i…/i斜体标记符等。(三)table表格标记的设置:[示例7]表格标记,在记事本中输入以下HTML语句,保存后在浏览器中浏览,效果如图所示。htmlheadtitle我的花店/titlestyletype=text/css!--.style3{font-size:24px;}--/style/headbodybgcolor=#FFFF99tablewidth=317height=182border=1trtdcolspan=2divalign=centerclass=style3节日/div/tdtddivalign=centerclass=style3名称/div/td/trtrtdrowspan=3divalign=centerclass=style35月/div/tdtddivalign=centerclass=style31日/div/tdtdheight=36divalign=centerclass=style3国际劳动节/div/td/trtrtddivalign=centerclass=style34日/div/tdtdheight=31divalign=