HTML_Chapter1.pptVIP

静态网页和动态网页 静态网页 不能互动交流 手动修改 开发成本低，维护成本高 动态网页 交互性 自动更新 因人因时而变 如何上网? 网络的工作原理 客户端 向服务器发送页面请求 Web 服务器处理请求并返回请求的页面 HTTP 负责请求和响应 如何上网? Web 服务器 客户端 HTTP协议 协议 用于访问 Web 上资源的一组规则 HTTP 是 Web 协议 站点地址或 URL HTML语言用于制作网页 WEB的工作原理 网页制作者(WEB程序员) 网页制作工具 文本编辑器 专业工具 网页代码的语言规范:HTML WEB网页纯文本*.HTM 标记 服务器 存放网页 上传或拷贝 浏览者 浏览器 客户端 网址(URL资源定位) 请求 响应 HTML源代码 浏览者看到的网页画面 翻译解释 如何创建网页 网页的基本结构 网页以html开始/html结束 两个主要的结构：head首部，body主体 html head …… /head body …… /body /html 如何创建网页 网页的头部 结构：head…/head 内容：title, meta, CSS, Javascript 网页的主体 结构：body…/body 内容：包含网页中显示的文本、图像和链接等 html head …… /head body …… /body /html … head title欢迎来到中软国际/title Meta http-equiv=“keywords” content=“软件工程师” style ……. /style script ……. /script /head… html head …… /head body …… /body /html … body … img src=“welcome.jpg” a href=“index.html”欢迎来到中软国际/a … /body… 什么是标记及其属性? 什么是标记? 定义：Html命令称为标记(标签) 作用：用于控制Html文档的内容和外观 分类： 单独标签:br，hr 成对标签:a…/a 标记的属性 作用：修饰或进一步制定信息。 如颜色，对齐方式，高度，宽度等 body bgcolor=“green” 标签 属性 属性值 html head title学习 HTML /title /head body bgcolor= “green” 欢迎来到 HTML 世界 /body /html 标签及其属性 标签 body…/body 属性 bgcolor=“” ３种方法获取颜色值 属性 background=“” 相对路径、绝对路径 标签 p/p 属性 align=“” 取值范围(left,right,center) 标签 br 路径 相对路径 由当前文件所在的路径引起的跟其它文件(或文件夹)的路径关系 范例: web/article/01.htm 绝对路径 目标文件的完整路径 范例: /sport/ac_milan.gif 物理路径 物理路径指的是某一台计算机本地的路径 范例: C:\Web\index.html 标签及其属性 标签 img 作用:显示图片 属性 src=“” (相对路径，绝对路径) 属性 align=“” 取值范围(left,right; top,middle,bottom) 属性 alt=“” 标签 a/a 作用:超级链接 属性 href=“” 标签及其属性 锚记a name=“” 页内链接 链接到另一网页的锚记 Html语言注释 !-- 这个注释内容将不会被显示在浏览器上 -- 总 结 了解internet , 万维网 熟悉网页的基本组成结构 标记及其属性的构成 段落标记，图片标记，超级链接标记 相对路径，绝对路径，物理路径 作 业 要求建立站点，站点命名为班级名称 个人简历： 网页1： 1：个人图片 2: 个人基本情况介绍(性别，年龄，姓名等等) 网页2： 1：个人学习经历介绍 2: 个人工作经验介绍 要求 用到段落标记进行排版，图片标记 从网页1中能链接到网页2的链接 作 业 个人简历 姓名：*** 性别: * 年龄：** 。。。。。 其他信息 1 自我介绍 2 工作简历 3 家庭成员 自我介绍 ********* ********* ********* 工作简历 1********* 2********* 3********* 家庭成员 父亲：*** 母亲：*** * * * 1、 HTML语言基础 客户端 – 服务器模型 客户端向服务器发出请求 服务器处理请求并将响应发送给客户端 平台