第二讲 网页中的文字和图像.pptVIP

网页中的文字和图像 主讲：臧顺娟 * 第二讲 本讲目标 掌握HTML文件基本结构 掌握HTML中的文字标签 掌握文字列表的使用 掌握特殊文字符号的表示 掌握图像的使用 * * （一）HTML标签 “html”标签放在HTML文件的开头，告诉浏览器，这个文件是HTML文件。而在文件的结尾，是“/html”结束标签。 （二）文件头标签head/head 文件头标签是“head”和“/head”，一般放在“html”标签的后面，用来标明文件的题目或定义部分。 一、HTML文件基本结构 * （三）文件标题标签title/title 文件标题标签为“title”和“/title”。这对标签用来设定文件的标题。浏览器通常都会将文件标题显示在浏览器窗口的左上角，因此这个标题很有用。 （四）文件体标签body/body 文件体标签为“body”和“/body”。这对标签一般都被用来指明HTML文档的内容，例如文字、标题、段落和列表等，也可以用来定义主页背景颜色。 一、HTML文件基本结构 使用“对齐”属性 * 一、HTML文件基本结构 * （五）注释标签 注释标签!-- 注释内容--,注释标签用于在HTML文档中添加注释，对内容起着解释说明的作用。 案例 ：在前面的例子中加入如下内容 -- 这是文件的标题-- 一、HTML文件基本结构 * 二、HTML中的文字标签 （一）换行标签br * 二、HTML中的文字标签 （二）段落标签p/p * 二、HTML中的文字标签 （三）文字的大小设置font size=3…/font * 二、HTML中的文字标签 （四）文字的字体font face=“宋体”/font * 二、HTML中的文字标签 （五）文字的样式 * 二、HTML中的文字标签 （六）文字的颜色font color=color_value…/font color_value有两种表示方法： 直接写上颜色的英文名称，共有十六种颜色名称。 以#为前缀的六个十六进制数 六个十六进制数分为三组,每组两位,依次表示红,绿,蓝颜色的强度。F为最高，0为最低。 颜 色 名 称 十六进制数 颜 色 名 称 十六进制数 颜 色 名 称 十六进制数 Black #000000 White #FFFFFF Purple #800080 Green #008000 Yellow #FFFF00 Teal #008080 Silver #C0C0C0 Maroon #800000 Fuchsia #FF00FF Lime #00FF00 Navy #000080 Aqua #00FFFF Gray #808080 Red #FF0000 Olive #808000 Blue #0000FF * 二、HTML中的文字标签 （七）位置控制标签名 align=left /标签名 二、HTML中的文字标签 （八）标题标记h1~h6 标题标记，用于表示文档内容的标题内容，以及标题内容的级别 * 三、设置文字列表 ul 无序列表标记，表示列表所包含的项是没有先后顺序的 列表项使用li表示 ol 有序列表标记，表示列表所包含的项是有先后顺序的 列表项使用li表示 li 列表项标记，只能和ul或ol结合使用 * 三、设置文字列表 无序号列表 无序号列表使用一对标签是ul和/ul，第一个列表项前使用li * 三、设置文字列表 序号列表 使用标签ol/ol，每一个列表项前使用li 四、特殊文字符号的表示 在HTML中表示“”和“” 使用字符“lt;”和“gt;” 空格的表示 使用字符“nbsp;” 注意：尽量不要使用多个“nbsp”来表示多个空格，因为多数浏览器对空格的距离的实现是不一样的。（例2-1） 版权符号的表示 使用字符“copy;” “”符号的表示 使用字符“amp;” 五、在网页中使用图像 网页中图片的分类 内容图片 “修饰”用图片 网页中常用图片的格式 gif格式，色彩表现少，但是解析速度快，还可以实现“动画”效果，是网页“修饰”图片的第一选择 Jpg格式，色彩表现多，是网页中内容图片的第一选择 五、在网页中使用图像 网页中的路径问题 网页设计中的所有文件，原则上都必须放置在一起，即在同一个文件夹下(这个文件夹是网页的“根”文件夹) 相对路径 参照自身的位置，而定义的路径，叫做相对路径 例2-2 相对路径有三种表示方法 可以使用“.”代表当前文档自身的当前所在文件夹，当然，也可省略 可以使用“..”代表当前文档所在文件夹的上一级文件 可以使用“/”代表网站的根目录(放在磁盘中，则为磁盘根目录) 五、在网页中使用图像 根文件夹 wwwroot 子文件夹 example 当前网