通过Dreamweaver_CS3学习HTML+DIV+CSS_第2章__网页头部Head.ppt

第2章网页头部Head 在第1章中介绍了网页结构 虽然头部内容不会显示在网页的主体里面 但对于网页来说 有着至关重要的影响 网页中加载的顺序是从头部开始的 例如 网页的标题是浏览者得到的第一条信息 浏览者可以根据标题来判断是否继续查看该网页 网页中的脚本一般都放在 之间 以便在网页主体中使用脚本时已经加载完成 否则脚本运行会出错 2 1头部包括的内容 前面讲了头部之间内容的重要性 文件头部一般包含标题标签 标签 内联样式表及预定义脚本等 接下来介绍头部之间所包含的内容 2 1 1网页标题 网页标题显示在浏览器的标题栏上 当浏览者打开网页时 从网页中得到的第一条信息便是网页标题 网页标题可以简明地概括网页的内容 点明网页的主题 从而浏览者可以决定是否往下浏览 另外 网页标题也是搜索引擎robots搜索时的主要依据 在大量的网络信息中 浏览者如果想搜索到自己的网页 最好的办法是定义一个合适的标题 2 1 2标签 标签在网页内容中不显示 但它的作用不容忽视 标签主要用于为搜索引擎robots定义页面主题信息 它还可以用于定义用户浏览器上的cookie 鉴别作者 设定页面格式 标注内容提要和关键字 同时 它还可以设置页面 使其根据定义的时间间隔刷新自己 以及设置RASC内容等级等 2 1 3样式表和脚本 网页内联定义的样式表通常放在网页头部 这样 可以在网页内容加载之前先定义内容中需要的样式 从而防止样式的不完全载入 以及破坏网页的结构和外观等现象 其次 当网页中的元素需要修改样式时 方便进行查找和修改 从而使页面的结构清晰明了 2 2查看头部 虽然头部的内容不会显示在网页主体内 但是DreamweaverCS3依然提供了编辑工具 下面是查看头部内容的具体步骤 文件头 窗口 属性 面板 2 3设置标题 设置网页标题很简单 具体步骤如下 2 3设置标题 新建基本页 网页默认的标题为 无标题文档 单击 文件 保存 命令 保存网页 按F12键进行预览 效果如图 新建页设置标题 2 3设置标题 单击 页面属性 按钮 弹出 页面属性 对话框 如图所示 页面属性 对话框 2 4认识标签 标签的功能强大 但不是可见元素 所以不能用设置可见元素的方法进行设置 下面讲解如何在DreamweaverCS3中插入标签 并对其进行设置 在新建的网页中已经包含了一个标签 源码如下 2 4认识标签 上面源码是设置文档类型和网页字符集 如果需要添加其他功能 需要插入标签的其他属性 例如添加网页描述 具体步骤如下 标签选择器 对话框 标签编辑器 meta 对话框 2 4认识标签 以上是通过插入标签的方法 DreamweaverCS3还提供了更方便的方法 具体步骤如下 常用 选项卡 文件头 下拉菜单 说明 对话框 2 5HTTP标题信息http equiv 首先介绍http equiv属性 http equiv类似于HTTP的头部协议 会返回一些有用信息给浏览器 以帮助浏览器正确和精确地显示网页内容 常用的http equiv属性值有Content Type Content Language Refresh Expires Pragma Set Cookie Window target Page Enter Page Exit MSThemeCompatible和Content Script Type等 下面进行详细讲解 2 5 1设置文档类型与语言属性Content Type Content Type属性用来设置文档类型 浏览器从content的属性值中获取网页的语言类型 判断是HTML还是XML 通常设置为text html charset指明网页中文字使用的字符集 例如 如果是简体中文 charset gb2312 如果是繁体中文 则charset big5 若未正确设置语言文字集 将可能导致网页显示混乱 使用格式如下 2 5 2设置自动刷新属性Refresh Refresh属性设置页面自动刷新的时间 或自动跳转到其他的网页 此时的content属性值是自动刷新的时间或自动跳转的时间 单位是秒 URL是设置跳转网页的地址 使用的格式如下 源码设置为10秒后 自动跳转到百度网站 上面的源码设置为10秒后 自动跳转到百度网站 2 5 3设置缓存时间属性Expires Expires属性是设置网页在缓存中的过期时间 一旦网页过期 必须重新从服务器上载入 content属性值可设置为时间长度 也可设置为到期的日期 如果设置为日期 日期的格式必须是格林时间 使用格式如下 2 5 4设置禁用缓存属性Pragma Pragma属性是设置禁止浏览器从本地计算机的缓存中调阅页面内容 如果设置了此属性值 网页则不保存在缓存中 每次访问时都刷新页面 这样设定 浏览者将无法脱机浏览 使用格式如下 2 5 5设置网页Cookie属性Set Cookie Set Cookie用于设置Cookie 当浏览器访问页面时 将其自动保存 下次再访问该页面时 可直接从文件中读取 以提高速度 通常HTML文件不需要使用禁用缓存 对于ASP等页面 就可以使用禁用缓存 因为每次看到的页面都是在服务器下动态生成的 缓存就失去意义了 如果网页过期 存盘的Cookie将被自动删除 2 5 6设置打开窗口属性Window target Window target用于设置打开窗口的属性 通过这个属性来强制页面在当前窗口以独立页面显示 使用格式如下 2 5 7设置过渡效果属性Page Enter Page Exit Page Enter与Page Exit用于页面打开或关闭时的过渡特效 content的属性值是动态滤镜的一种 blendTrans滤镜产生渐隐效果 Duration参数设置特效持续的时间 单位为秒 revealTrans滤镜产生多种效果 Duration参数设置特效持续的时间 transition参数设置效果类型 其取值范围为0 23 2 5 8设置主题与脚本类型属性MSThemeCompatible Content Script Type MSThemeCompatible设置是否关闭WindowsXP主题 content属性值为Yes或No 使用格式如下 以上是http equiv属性的介绍 并没有完全囊括所有类型 如需要更详细地了解 参阅其他资料 下面讲解name属性 2 6页面描述信息name name的属性值有Keywords Description Author和Robots等 name属性主要用来描述页面信息 它是搜索引擎识别的关键所在 为了使网页被搜索引擎发现 设置name属性是必不可少的 下面对各个属性值的类型分别进行介绍 2 6 1设置描述与关键词属性Description Description 页面内容的简介 用来告诉搜索引擎网站的主要内容 在设置时尽量要把简介写得清晰明白 字数不能太短也不能太长 一般保持在80 200之间 Keywords 页面关键字 用于为搜索引擎提供关键字的列表 选择合适的关键字是提高被搜索几率的关键因素 多个关键字之间用逗号隔开 逗号表示逻辑 或 空格表示逻辑 与 2 6 2设置搜索机器人引向属性Robots Robots属性用于设置搜索机器人的引向 Robots用来告诉搜索机器人哪些页面需要索引 哪些页面不需要索引 Content的参数有all none index noindex follow和nofollow 默认为all 2 6 3设置作者信息属性Author Author用于设置作者信息 content属性值就是作者的相关信息 使用格式如下 以上介绍http equiv和name常用属性的设置方法 由于标签设置比较复杂 读者可以在使用的过程逐渐掌握 2 7设置基链接属性base 标签设置网页的基链接 使用格式如下 href属性值是基链接的位置 当设置好基链接后 自动在网页中的相对路径前加上 2 8设置链接文件属性link 标签用于设置链接到的文件 从而引入外部文档 使用格式如下 其中href