描述
开 本: 16开纸 张: 胶版纸包 装: 平装是否套装: 否国际标准书号ISBN: 9787560991702
《Dreamweaver CS6网页设计实用教程/国家示范性高等职业教育电子信息大类“十二五”规划教材》的内容包括网页设计基础、Dreamweaver CS6的操作环境、文字应用、图像应用、表格应用、超链接应用、多媒体应用、CSS样式表、框架和AP元素、行为和JavaScript应用、Div+CSS网页布局基础、Spry框架、模板和库、表单、网站开发与发布。另外,本书在附录中针对Dreamweaver CS6中文版的“CSS规则定义”相关参数都是英文的情况,采用中英文对照的方式,详细介绍CSS规则定义相关参数,以方便读者学习。
为了方便教学,本书还配有教学课件等教学资源包,任课教师和学生可以登录“我们爱读书”网免费注册下载,或者发邮件免费索取。
《Dreamweaver CS6网页设计实用教程/国家示范性高等职业教育电子信息大类“十二五”规划教材》图文并茂、内容翔实,集操作性、实用性和针对性于一体,主要面向学习网页设计与制作的初、中级读者,适合大中专院校计算机应用、电子商务、网络技术等专业以及计算机培训机构的教学需求,也可作为广大网站设计者的参考用书。
1.1 网页设计基础知识
1.2 html基础
本章小结
习题1
第2章 Dreamweaver CS6的操作环境
2.1 初识Dreamweaver CS6
2.2 操作实例——用Dreamweaver制作一个简单的网页
2.3 “代码”视图
2.4 站点的建立
本章小结
习题2
第3章 文字应用
3.1 网页中的文字
3.2 操作实例——设置页面属性
本章小结
习题3
第4章 图像应用
4.1 网页中的图像
4.2 编辑图像
本章小结
习题4
第5章 表格的应用
5.1 在网页中应用表格
5.2 导入表格数据并排序
5.3 操作实例——用表格布局网页
本章小结
习题5
第6章 超链接应用
6.1 超链接
6.2 创建超链接
6.3 管理超链接
本章小结
习题6
第7章 多媒体应用
7.1 网页中应用Flash动画
7.2 在网页中应用视频
7.3 在网页中应用音频
本章小结
习题7
第8章 CSS样式表基础
8.1 CSS层叠样式表概述
8.2 CSS选择器类型
8.3 操作实例——用CSS控制页面元素
8.4 链接外部CSS样式文件
8.4 管理CSS样式表
本章小结
习题8
第9章 框架和AP元素
9.1 框架
9.2 IFRAME元素
9.3 AP元素
本章小结
习题9
第10章 行为和JavaScript的应用
10.1 行为
10.2 JavaScript入门
本章小结
习题10
第11章 Div+CSS网页布局基础
11.1 Div标签
11.2 Div+CSS布局
11.3 操作实例——Div+CSS布局
本章小结
习题11
第12章 Spry框架
12.1 Spry框架概述
12.2 Spry构件
12.3 Spry效果
本章小结
习题12
第13章 模板和库
13.1 模板
13.2 库
本章小结
习题13
第14章 表单
14.1 表单的基础知识
14.2 表单对象
14.3 使用Spry验证表单对象
14.4 操作实例——设计注册表单
本章小结
习题14
第15章 网站开发与发布
15.1 网站开发流程
15.2 操作实例——局域网发布网站
本章小结
习题15
附录
附录A DW CS6的CSS定义详解
附录B 习题参考答案
参考文献
本章主要介绍Dreamweaver CS6的工作环境,通过创建简单的网页,熟悉网页制作的过程。描述站点的创建方法及站点的管理,另外,简单地演示如何在“代码”视图中编辑HTML。
·Dreamweaver CS6工作环境;
·建立站点;
·在“代码”视图中创建HTML。
2.1初识Dreamweaver CS6
掌握Dreamweaver CS6的工作环境是学习网页制作的基础,而软件的安装与卸载、启动,Dreamweaver的工作界面以及帮助是学习软件的首要任务。
2.1.1Dreamweaver CS6的安装与卸载
1.Dreamweaver CS6的安装
安装Dreamweaver CS6,具体的操作步骤如下。
(1)步骤1双击Dreamweaver CS6的安装文件,程序会自动开始解压缩,单击“确定”按钮,弹出如图2-1所示的界面。
(2)步骤2选择文件解压缩的路径,单击“下一步”按钮,依次弹出如图2-2至图2-4所示的界面。
图2-1安装界面一
图2-2安装界面二
(3)步骤3在图2-4所示的界面单击“接受”按钮,弹出如图2-5所示窗口,单击“安装”按钮即可成功安装Dreamweaver CS6,弹出如图2-6所示的界面。
图2-3安装界面三
图2-4安装界面四
图2-5安装界面五
图2-6安装界面六
(4)步骤4选择“立即启动”,弹出如图2-7所示的“默认编辑器”对话框,单击“确定”按钮,即可进入软件界面。
图2-7“默认编辑器”对话框
2.Dreamweaver CS6的卸载
卸载Dreamweaver CS6与卸载其他的应用程序一样,具体的操作步骤如下。
(1)步骤1在“控制面板”中选中“添加或删除程序”列表项,打开“添加或删除程序”窗口,如图2-8所示。
(2)步骤2选择“AdobeDreamweaver CS6”,单击“卸载”按钮,弹出“卸载选项”窗口,如图2-9所示。
(3)步骤3单击“卸载”按钮,弹出显示卸载进度窗口,如图2-10所示,即可完成卸载工作,卸载完成窗口如图2-11所示。
图2-8卸载界面一
图2-9卸载界面二
图2-10卸载界面三
图2-11卸载界面四
2.1.2Dreamweaver CS6的启动
选择“程序”→“所有程序”→“AdobeDreamweaver CS6”命令,可以启动程序,弹出DW窗口,如图2-12所示。在此窗口中显示了一个开始页,可以选择以哪种方式使用Dreamweaver。
图2-12DW窗口
2.1.3Dreamweaver CS6工作界面
在Dreamweaver CS6开始页中,选择“新建”列表中的“HTML”选项,启动Dreamweaver CS6的工作窗口,如图2-13所示。Dreamweaver CS6所提供的工作区环境,将全部功能面板集成到了一个应用程序窗口中,使用者可以自己选择布局模式进行开发,如图2-14所示。
图2-13Dreamweaver CS6的工作窗口
图2-14“工作区切换器”下拉菜单
Dreamweaver CS6的工作窗口包含菜单栏、文档工具栏、文档窗口、属性检查器、标签选择器、面板组。
·文档窗口:用来显示当前创建和编辑的文档内容,是网站设计和开发的主要工作区。
·文档工具栏:包含一系列的操作按钮,使用这些按钮可以在编辑文档的不同视图间快速切换,例如“代码”视图、“设计”视图、同时显示代码视图和设计视图的“拆分”视图。工具栏中还包括查看文档、传输文档相关的常用命令,如图2-15所示。
图2-15文档工具栏
·属性检查器:一个用于查看和编辑所选对象或文本的各类属性(如格式、样式、字体等)的功能面板,如图2-16所示。
图2-16属性检查器
·标签选择器:主要作用是标签导航功能,可以很方便地定位到插入至页面中的任意标签。选中要编辑的插入对象,对其进行相关的属性设置。
·面板组:针对具体功能模块,Dreamweaver CS6把一些相关面板进行分组并集成在一起。单击面板组名称,就能展开相对应的面板组,如图2-17所示。另外,也可以通过“窗口”菜单打开所需要的面板。
默认的面板组有以下面板。
1.“AdobeBrowserLab”面板
该面板可以使用CSS检查工具进行设计,使用多个查看、诊断和比较工具预览动态网页和本地内容,利用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。“AdobeBrowserLab”面板,如图2-18所示。
图2-17面板组
图2-18“AdobeBrowserLab”面板
图2-19“插入”面板
2.“插入”面板
“插入”面板包含用于创建和插入对象(例如表格、图像和链接)的按钮,这些按钮按类别进行组织,可以通过“类别”弹出菜单,选择所对应的类别来进行切换。当前文档包含服务器代码时(例如ASP或CFML文档),还会显示其他类别。图2-19即为“插入”面板,图2-20为“插入”面板在菜单栏下方的显示效果,每个按钮都对应一段HTML代码,允许在插入时设置不同的属性。
图2-20在“插入”面板菜单栏下方的显示效果
3.“CSS样式”面板
使用“CSS样式”面板可以跟踪影响当前所选页面元素的CSS规则和属性,或影响整个文档的规则和属性。使用“CSS样式”面板顶部的切换按钮可以在两种模式之间切换,即可以在“全部”和“当前”模式下修改CSS属性“CSS样式”面板如图2-21所示。
图2-21“CSS样式”面板
在“当前”模式下,“CSS样式”面板将显示三个窗格:①“所选内容的摘要”窗格,用于显示文档中当前所选内容的CSS属性;②“规则”窗格,用于显示所选属性的位置;③“属性”窗格,允许编辑定义所选内容的规则的CSS属性。在“全部”模式下,“CSS样式”面板显示两个窗格:“所有规则”窗格(顶部)和“属性”窗格(底部)。“所有规则”窗格显示当前文档中定义的规则以及附加到当前文档的样式表中定义的所有规则的列表;使用“属性”窗格可以编辑“所有规则”窗格中任何所选规则的CSS属性。对“属性”窗格所做的任何更改都将立即应用,这就可以在操作的同时预览效果。
4.“AP元素”面板
AP元素是分配有位置的HTML页面元素,可以包含文本、图像或其他任何可放置到HTML文档正文中的内容。Dreamweaver中的AP元素都显示在该面板中,在该面板中可以执行选择、命名和删除等操作,如图2-22所示。
5.“BusinessCatalyst”面板
使用Dreamweaver中集成的“BusinessCatalyst”面板连接并编辑利用AdobeBusinessCatalyst(需另外购买)建立的网站,利用托管解决方案建立电子商务网站,“BusinessCatalyst”面板如图2-23所示。
6.“文件”面板
“文件”面板是用户管理文件和文件夹的功能面板,通过这个面板可以访问本地磁盘上的全部文件,或是服务器整个站点中的所有文件。操作模式类似于Windows的资源管理器,如图2-24所示。
图2-22“AP元素”面板
图2-23“BusinessCatalyst”面板
7.“资源”面板
“资源”面板主要用于显示站点或收藏中的资源信息,这些资源可以按类别显示,如图2-25所示。
图2-24“文件”面板
图2-25“资源”面板
2.1.4Dreamweaver CS6的帮助
“帮助”菜单中的联机帮助系统提供了有关使用Dreamweaver CS6可执行任务的详细信息。初学者可以在帮助文件中执行全文搜索,找到相关主题的帮助信息,具体步骤如下。
(1)步骤1选择“帮助”→“Dreamweaver帮助”命令,打开“Dreamweaver帮助/帮助和教程”窗口,如图2-26所示。
图2-26“Dreamweaver帮助/帮助和教程”窗口
(2)步骤2单击标签,查看该标签的相关信息,也可以通过窗口左侧的搜索命令搜索相关信息,以获得帮助信息。
……
评论
还没有评论。