企业网站制作与维护03v10研讨.ppt

实现思路 新建页面根据效果图中内容制作网页 首页设置超链接等内容 “登录”链接到网站登陆页面“login.html” “新闻中心”链接到网站新闻页面“news.html” “产品”链接到网站产品页面“product.html” “服务”和“更多”做空链接，即“href=#” 图片为邮件链接，邮件链接地址为“benet@” 登录页面设置超链接等内容 新闻中心设置超链接等内容 实验案例1：网络集成网站（一）3-2 学员练习 新建站点并新建页面 输入页面内容 设置页面超链接等内容 保存页面，浏览页面效果，验证超链接等 实验案例1：网络集成网站（一）3-3 55分钟完成 需求描述 公司网站包括4个页面 主页（index.html，标题为“BENET公司主页”） 登录页面（login.html标题为“登录页面”） 新闻中心（news.html标题为“公司新闻”） 产品页面（product.html标题为“公司产品”） 使用HTML基本标签制作产品页面 实验案例2：网络集成网站（二）2-1 网站产品页面 35分钟完成 实验案例2：网络集成网站（二）2-2 实现思路 新建页面根据效果图中内容制作网页 设置超链接（包括锚链接等）等内容 学员练习 新建页面输入页面内容 设置页面超链接等内容 保存页面，浏览页面效果，验证超链接等 * * * * * 与图片的路径类似，以巩固为主！ * * * * * .flower { border:0px; } /*图片超链接后会出现边框，此样式设置边框为0，不显示边框，后续课程讲解*/ * * * * * 说明图片是dt-标题 下面的文字是dd-描述 * * 标准的由来，多个浏览器厂商的竞争、HTML编码混乱 遵守国际化WEB标准，确保多个浏览器都兼容 W3C-万维网联盟，负责制定web行业标准，它包括一系列的标准。 * * * * * * * * * * * * * B e n e t BENET 4.0 B e n e t BENET 4.0 */31 BENET 4.0 B e n e t BENET 4.0 */35 B e n e t BENET 4.0 */35 第三章 HTML基本标签（二） —— 理论部分 HTML的基本结构是什么？ 文本相关标签有哪些？ hr /、br 、img /标签分别代表什么含义？ 常用于页面的图像格式有哪些？ 课程回顾 会使用超链接相关标签实现页面跳转 会使用列表相关标签实现页面有序/无序类表 会使用定义标签实现页面定义样式 了解W3C标准 了解HTML代码注释 技能展示 本章结构 W3C标准 图片超链接 HTML基本标签（二） 超链接的基本用法 超链接的三种类型 超链接a标签 W3C标准要求的Web页结构 什么是W3C标准 XHTML 1.0的基本规范 列表标签 HTML注释 超链接的基本概念 实现页面间的导航 超链接标签2-1 链接文本或图像 链接地址（目标） 超链接标签2-2 a href=链接地址 target=目标窗口位置链接热点文本或图像/a 超链接的基本语法 href：用于设定链接地址 target：指定链接在哪个窗口打开 _blank：将链接的文档加载到一个未命名的新浏览器窗口中 _self：将链接的文档加载到该链接所在的同一框架中，默认值 a href=router.html target=_blank思科路由器/a 链接在新窗口中打开 a href=../web1.htm上级目录/a a href=../../web2.htm上上级目录/a 相对地址：相对于当前目录的地址，常用 绝对地址：指向目标地址的完整描述 ，少用 链接路径 上级目录：../ 上上级目录：../../ a href=搜狐/a a href=login/login.htm登录/a 页面间链接 最常用的一种链接，由A页跳转到B页，用于网站导航 锚链接 A页甲位置到A页（本页）的乙位置 A页甲位置到B页的乙位置 功能性链接 页面中调用其他程序功能，电子邮件、QQ、下载等 超链接的三类类型5-1 a href=login/login.html[会员登录]/a a href=flower/product.html[鲜花产品]/a 页面间链接 超链接的三类类型5-2 相对路径 常用于网站导航 实现锚链接（页面内锚链接） 定义标记（锚） 设置链接到标记位置 超链接的三类类型5-3 …… a href=#five第五首：《蜀相》/a …… a name=five《蜀相》/abr / 作者：杜甫br / …… 定义标记 设置链接到标记位置 a name=marker目标位