保密资料,禁止外传DIV+CSS建站手册.PDF

★保密资料，禁止外传 DIV+CSS 建站手册 DIV+CSS 建站手册 西安博达软件股份有限公司 ★保密资料，禁止外传 DIV+CSS 建站手册 第一章 Dreamweaver 扩展插件的安装 DIV+CSS 是网站标准（或称“WEB 标准”）中常用术语之一，DIV+CSS 是一种网页的布局 方法，这一种网页布局方法有别于传统的HTML 网页设计语言中的表格（table）定位方式， 可实现网页页面内容与表现相分离。在XHTML 网站设计标准中，不再使用表格定位技术，而 是采用DIV+CSS 的方式实现各种定位。 为了更好的在网站群产品中使用DIV+CSS 创建网站，建议首先安装Dreamweaver 扩展插 件。下面介绍如何安装插件： （一）安装Dreamweaver 扩展管理器  Dreamweaver 版本：建议Dreamweaver 8 以上官方完整版。  登陆到站点管理平台→切换到网站管理→网站建设，查看 Dreamweaver 扩展插件使用帮 助，根据帮助文档安装扩展管理及插件，如图1 所示： 图1 西安博达软件股份有限公司 地址:中国•西安市高新区科技四路209 号东办公楼4 层 邮编:710065 XI’AN WEBBER SOFTWARE CO., LT D. 电话:+86-29传真:+86-29网址: 第 2 页 共 13 页 ★保密资料，禁止外传 DIV+CSS 建站手册 第二章 样式组件的基本认识 上面介绍了实施前的准备工作，下面我们就要针对实施过程中，如何使用样式组件进行 网站实施进行详细的讲解了。我们来认识一下样式组件：  在文件|模板左下方的组件库中，组件缩略图旁边有个紫色的“div ”标记，表示该组 件为样式组件，如图2 图2  拖拽样式组件到模板页面上保存后，点击组件的样式配置 （ ），如图3 图3 可以看到样式组件分为 “1”“2 ”“3 ”“4 ”四个区域。 1：样式预览区；2：样式配置区；3 ：代码输出区；4 ：参数拖拽区。 在 1 区，可以看到这样的功能 。如勾选了“使用模板 西安博达软件股份有限公司 地址:中国•西安市高新区科技四路209 号东办公楼4 层 邮编:710065 XI’AN WEBBER SOFTWARE CO., LT D. 电话:+86-29传真:+86-29网址: 第 3 页 共 13 页 ★保密资料，禁止外传 DIV+CSS 建站手册 环境预览”功能前方复选框，即可引入所在模板的相关环境进行预览，包括模板的 doctype 设置，引用的css 样式表和js 脚本。鼠标移动到右侧的“详情”可查看引入的环境， 在2 区，可以设置一些组件的配置属性等。 在进行组件功能编码的时候，主要在3、4 区进行操作。 第三章 几种常见功能的样式翻译 认识样式组件后，我们就结合实际的网站进行样式组件实施网站的翻译工作了。因为网 站功能千变万化，在这里不能一一讲解，我们以导航，文章列表，链接列表这几个常用的样 式组件为例进行详细演示。 （一）翻译步骤 步骤 1：首先新建模板，选用本地 HTML 源文件进行静态页