特殊字符的插入和文字特殊标记的掌握文字和图片的链.pptVIP

实验难点 实验内容 实验目的 实验重点 实验步骤 实验项目三　HTML基本标记及表格 上一页 下一页 课程trtrrtrtrtrtrrtt 下一页 上一页 退出 主菜单 教学目的 重点难点 教学方式 课程设计 教学过程 课程作业 课程小结 教学参考 主菜单 重点难点 教学内容 课程作业 课程小结 教学参考 教学目的 课程trtrrtrtrtrtrrtt 上一页 上一页 下一页 退出 主菜单 重点难点 教学内容 课程作业 课程小结 教学参考 教学目的 退出 * 返回上一级 实验内容 1、字体标志的应用 2、特殊字符的插入和文字特殊标记的掌握 3、文字和图片的链接 4、在页面中插入图片 5、表格属性的应用 实验目的 1、能熟练完成项目一HTML中基本标记的应用实例 2、能熟练完成项目二表格的应用实例 实验重点 1、字体标志的应用 2、特殊字符的插入和文字特殊标记的掌握 3、文字和图片的链接 4、在页面中插入图片 5、表格属性的应用 实验难点 1、表格属性的应用  （一）演示二个项目效果图 1、项目一　基本标记的应用实例 2、项目二　表格属性应用实例 2、图片插入的应用实例效果图 （二）演示项目一中三个子项目效果图 1、页面中文字插入的应用实例效果图 3、按钮图标的制作实例 （三）演示并与学生一起完成三个子项目 1、页面中文字插入的应用实例的实验步骤 （1）打开已经输入的html文件的基本结构的记事本； （2）在title/title之间输入网页标题“HTML表格及元素的添加”； （3）我们将文件保存到D盘，文件夹名为网页设计，文件名为H2_01.html，文件类型为所有文件； （4）打开D盘网页设计文件夹中的H2_01.html文件，大家可以看到标题栏上有“HTML表格及元素的添加”的标题； （5）打开“查看”菜单“源代码”，在body/body中输入文字“御茶园茶业gt;网上商城”； （6）再一次保存，然后“刷新”页面；大家先完成在页面中添加文字这部分内容，老师来检查完成情况。 （7）打开“查看”菜单“源代码”，在文字“御茶园茶业”前加上font size=14b，后面加上/b/font，设置文字为粗体，并且字号设置成14px； （8）保存后刷新页面； （9）打开“查看”菜单“源代码”，在文字“网上商城”前加上font size=14 color=”#ff6600”b，在后面加上/font/b，设置文字为粗体，并且字号设置为14px，颜色为橙色； （10）刷新后第一个子项目已完成。效果如下图： 2、图片插入的应用实例的实验步骤 （1）前三步同上。 （2）在body/body中插入table/table表格标记； （3）在table/table表格标记中插入tr/tr行标记； （4）在tr/tr行标记中插入td/td标记； （5）在td标记中，输入“background=图片地址” height=180px； （6）将文件保存到D盘，文件夹名为网页设计，文件名为H2_02.html，文件类型为所有文件； （7）打开D盘网页设计文件夹中的H2_02.html文件，预览网页效果； （8）打开“查看”菜单“源文件”； （9）在table标记中输入“cellPadding=0 cellSpacing=0 border=0 width=710”； （10）再一次保存页面。 3、按钮图标的制作实例实验步骤： （1）前三步同上。 （2）先做一个按钮； （3）在table/table表格标记中插入tr/tr行标记； （4）在tr/tr行标记中插入td/td标记； （5）在td/td中输入“茶艺用品”td标记中，输入background=“图片地址” align=middle width=80 height=22； （6）将文件保存到D盘，文件夹名为网页设计，文件名为H2_03.html，文件类型为所有文件； （7）打开D盘网页设计文件夹中的H2_03.html文件，预览网页效果； （8）打开“查看”菜单“源文件”； （9）在table标记中输入“cellPadding=0 cellSpacing=0 border=0”； （10）在文字“茶艺用品”的前面加上a，在后面加上/a （11）刷新网页； (12）其它几个按钮的代码同（5）至（10）步，只是文字内容有变化。 强调：先设计好，表格中的列数，即td/td的个数。 第一个项目实验步骤　　第二个项目实验步骤 （四）演示项目二的效果图 根据我提供的HTML文件，大家修改得出最