计算机技术应用08网页.pptVIP

华东师范大学计算中心 第五章 网页制作 掌握 使用表格布局网页； 制作框架网页； 在网页中运用层； 网页中的文字处理； 网页中的图像处理； 网页中超级链接的设置； 网页中Flash动画的应用； 网页中表单的制作。 第五章 网页制作 基础知识 Dreamweaver 8操作基础 页面布局 网页中文本、图像和动画元素 制作表单 制作具有动态特效的网页 5.1 基础知识 1. 网页基本知识 2. 网页布局规划 3. 导航设计 4. 色彩搭配 5. 网页浏览原理及发布 1. 网页基本知识 网站 存放在网上某个服务器中的信息服务系统 网页间按一定的方式链接而成的整体构成网站 网页 一般含有文字、图像、动画和表格等元素 通过超文本链接实现页面间的跳转，用户可以跟随超级链接，来到它所指向的页面，从而获取到互动的、丰富多彩的信息。 网页基本知识 网页 通常以网页文件及其附属文件的形式存在 网页文件最终都采用超文本标记语言（Hyper Text Markup Language，HTML）说明网页中文字和图像的格式设置、层次结构、超文本链接等 根据页面内容是否固定，页面文件可以分为静态的超文本文件和动态页面 静态的超文本文件 在文本文件的基础上使用HTML语言描述其格式 可以在其中嵌入图像、声音、动画等信息 是纯文本文档，可以用任何一种文本编辑软件进行编辑 文件扩展名是.htm、.html、.shtml等 动态的超文本文件 采用动态网站技术生成的网页文件 文件扩展名是 .asp、.jsp、.php、.cgi等 HTML的标记 HTML标记说明网页中的内容及其相关信息是如何显示的 标记总是用三角括号括起 大多数标记成对出现，如：b网页制作/b，用成对标记对所“夹”内容的显示进行控制 结束标记比开始标记多“/” HTML文档的结构 html ‘网页文档的开始 head ‘头部标记 title第一次编写网页/title ‘标题标记 /head body ‘主体标记 网页制作 /body /html HTML的排版标记 P 独立段落 BR 换行 CENTER 居中显示 B/I/U 加粗、倾斜、下划线 H1/H1……H6/H6 标题1～标题6 FONT 字体 例1 文本标志的综合实例 html head title文本标志的综合实例/title /head body text=blue CENTER h1最大的标题/h1 h3使用h3的标题/h3 h6最小的标题/h6 浏览器显示效果（例1） HTML的排版标记 HR 水平线 IMG src= 插入图片 A href= 超级链接 例2 图像标志的综合示例 html head title图像标志的综合示例/title /head body p align=centerimg src=flower.jpg alt=网页制作/p hr width=600 size=2 color=#0000FF center 浏览器显示效果（例2） HTML的排版标记 OL 有序号列表 UL 无序号列表 LI 具体列表项 例3 列表示例 HTML BODY 无序号列表BR UL LI apples LI bananas /UL 浏览器显示效果（例3） HTML的排版标记 TABLE 表格 TR 表格行 TD 表格单元格 TH 表格标题行 HTML的排版标记 FORM 表单 INPUT 单行文本框、单选按钮、按钮 SELECT 列表框 Option 列表中的项目 TEXTAREA 多行文本框 例4 表格和表单综合实例 html body bgcolor= 00ddff center h3留言薄/h3 form name=frm1 method=post table cellspacing=2 cellpadding=2 border=1 tr td留言人/td tdinput type=text name=from size=30 maxlength=30 /td /tr tr td主 题:/td tdselect name=title tr td align=center colspan=2 您的职业是BR INPUT type=radio id=rdo1 nam