《第三章网页文本的设计(DOC).pdf》由会员分享,可在线阅读,更多相关《第三章网页文本的设计(DOC).pdf(6页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、HTMLHTML 网页设计教网页设计教案案章节课题列 1号共 5页第三章第三章 网页文本的设计网页文本的设计2015 年 3 月 16 日 第二周授课时数4 学时授课日期1.掌握 HTML 中文本的排版方法2.熟悉 HTML 中特殊文本的添加;教学目的3.掌握 HTML 文字列表的建立方法;HTML 与文本相关的标记与属性。教学方法多媒体网络教室,采用“演播”教学法。教学重点本阶段的重点是让学生掌握HTML 文档添加文本的方法及其对于文本排版修饰的手段。1.HTML 特殊字符文本添加教学难点2.网页文本排版3.无序列表、有序列表及其自定义列表的创建教 具 、 挂 图见课前准备工作作业题号见教案
2、:附加题教学过程及时间分配主要教学内容及步骤课前准备工作图样演示素材1.第三章网页文本的设计PPT 演示文稿;2.实时网站登陆演示3.HTML 代码书写HTMLHTML 网页设计教网页设计教案案续页续页第 2页教学过程及时间分配一、普通文本的添加一、普通文本的添加1.通过键盘直接输入例如例如 1 1:无标题文档2.通过复制粘贴的方式注意的 DW 中选择性粘贴的方法例如例如 2 2:二、特殊字符文本的添加二、特殊字符文本的添加1特殊符号以&开头后面跟相关特殊字符例如例如 3 3:在网页中展示“”代码:<<;1>1>;(1) 半角大空白:&ensp&ensp;(2) 全角大的空白:
3、&emsp&emsp;(3) 不断行的空白:  ;(4) 小于:<<;(5) 大于:>>;(6) &符号:&&;(7) 双引号:"";(8) 版权:©©;(9) 已注册商标:®®;(10)乘号:××;(11)除号:÷s÷s;(12)加减号:±±;(13)千分比:&permil&permil;(14)双向箭头:&harr&harr;2特殊公式标记1为上标标记,用于将数字缩小后显示于上方;2为下标标记,用于将数字缩小后显示于下方;练习练习 1
4、1:写出:写出(6(63 3+3+36 6)221=?1=?结果以千分比表示结果以千分比表示教学内容HTMLHTML 网页设计教网页设计教案案续页续页教学过程及时间分配教学内容练习练习 2 2:H H2 2+O+O2 2=H=H2 2O O运算式第 3页(63+36)÷2±1=?结果以&permil;表示。运算式H2+O2↔H2O二、二、HTMLHTML 网页文本的修饰网页文本的修饰1.重要文本1加粗文本;2强调文本;3加强调文本2.倾斜文本倾斜文本旁注的文字大小4.设置已删除文本已删除文本文本方向标签1从左向右显示:属性 dir 值为 “ltr”2从右向
5、左显示:属性 dir 值为 “rtl”二、二、HTMLHTML 网页文本的排版网页文本的排版1.实现段落与段内换行浏览器解释 HTML 代码时会忽略多余的空格和换行,不管输入多少个空格,都将HTMLHTML 网页设计教网页设计教案案续页续页教学过程及时间分配教学内容第 4页被视为一个空格。按回车键换行也是无效的,如果需要换行需要使用一个标记来告诉浏览器这里需要回车操作。例如 4:段落标记.用来定义网页中的一段文本,文本在一个段中会自动换行。换行标记是一个单个使用的标记,“break”的缩写,作用是将文字在一个段内强制换行;2.设置标题类似于 word 文档不同级别的标题,HTML 中共有 6
6、个标题标记,数字越小级别越高文字也相应越大。3使文字水平居中浏览器默认显示方式从靠左的位置开始显示文字4设置文字段落的缩进对某段文字进行缩进显示,正文的左右两侧都会距离浏览器边界增加一定的距离。5为网页添加水平线为了让网页内容更有条理的显示可以添加水平线,该标记也是单个使用的。四、设置文字列表1建立无序列表项目列表使用的一对标记是,其中每一个列表项使用结构如下:第一项第二项第三项2建立有序列表类似于 word 中的自动编号功能, 使用标记, 每一个列表项前使用结构:第一项第二项第三项3建立不同类型的无序列表前面的标记符号的变化DiscDisc 项目符号列表项目符号列表结构:HTMLHTML 网
7、页设计教网页设计教案案续页续页教学过程及时间分配项目 1项目 2项目 3CircleCircle 项目符号列表项目符号列表结构:项目 1项目 2项目 3squaresquare 项目符号列表项目符号列表结构:项目 1项目 2项目 34建立不同类型的有序列表数字列表数字列表结构:项目 1项目 2项目 3字母列表字母列表结构:项目 1项目 2项目 35建立嵌套列表教学内容第 5页HTMLHTML 网页设计教网页设计教案案续页续页教学过程及时间分配教学内容例如:例如:第一章第一节第二节知识点 1知识点 2第二章第三章第 6页6自定义列表用来创建一个普通的列表,用来创建列表中的上层项目,用来创建列表中最下层项目,和都必须放在标志对之间。总的来说标记定义了一个定义列表,定义列表中的条目是通过使用 标记(“definition title” ,定义标题)和标记(“definition description” ,定义描述)创建的。给出了术语名,标记给出了术语的定义。结构:文本文本五、综合上机实践五、综合上机实践- -制作简单的纯文本网页制作简单的纯文本网页六、上机作业制作旅游网网页六、上机作业制作旅游网网页