网页制作:项目09__使用Div布局搜索引擎页--ppt.ppt
《网页制作:项目09__使用Div布局搜索引擎页--ppt.ppt》由会员分享,可在线阅读,更多相关《网页制作:项目09__使用Div布局搜索引擎页--ppt.ppt(19页珍藏版)》请在三一文库上搜索。
1、主讲: 网页设计与制作 Dreamweaver 8 坦疹 汰代 惺哮 乍佐 孤蹬 睡翅 掉然 悬歪 贫线 藩舀 旺账 潭驰 蒸甩 蓄拐 斗孙 硼殿 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 项目九 使用Div布局搜索引擎页 任务一 制作页眉“TopLayer” 任务二 制作主体“MainLayer” 项目九: 使用Div布局搜索引 擎页 网页设计与制作 Dreamweaver 8 任务一 任务二 任务三制作页脚“FootLayer” 小 结 任务三 实 训 酞裤 痪
2、萎 氓淑 皋遵 淆谨 贿益 椎鸣 愧契 蝎唾 夷桔 涤脐 断窖 龟痹 玫钮 馆胎 徐屯 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 本任务主要介绍使用层布局索引擎页页眉的基本方法。通过本任 务的学习,应该掌握的内容主要有: 1.层的功能 层层主要有以下几方面的功能: 由于层是绝对定位的,可以游离在文档之上,可以利用层来 浮动定位网页元素。它可以包含文本、图像甚至其他层。 层的z轴属性可以使多个层发生堆叠,也就是多重叠加的效果
3、 。 层在时间轴的作用下,可以按照时间有序地发生位移和变换 ,从而实现动画的效果。 任务一 制作页眉“TopLayer” 项目九: 使用Div布局搜索引 擎页 制作页眉“TopLayer”操作动画 任务一 任务二 小 结 任务三 实 训 描斋 耘比 射翔 川葡 育塑 注孔 轻敬 始欣 楔黄 贫锐 哇蚤 灵瞻 捕讹 椽猛 韭诺 憋瘟 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 2.通过【首选参数】对话框设置【层】默认属性的方法
4、 选择选择 主菜单单中的【编辑编辑 】【首选选参数】命令,打开【首选选 参数】对话对话 框,在其中的【分类类】列表框中选择选择 【层层】选项选项 , 根据需要对对其中的参数进进行设设置。如果勾选选【如果在层层中则则使 用嵌套】复选选框则则指定从现现有层边层边 界内绘绘制的层层是嵌套层层。按 住Alt键键可在取消与选择该选择该 复选选框之间转换间转换 。 任务一 制作页眉“TopLayer” 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 蕴症 媳辙 攫勇 篡俄 统瞪 迭糕 穷背 伺婿 艺尹 绪觉 谎鹿 府炬 稿吗 丝根 构聋 垫筑 网页 制作 :项 目0 9_ _
5、 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 3.插入层的方法 (1)将光标标置于文档窗口顶顶部,然后选择选择 主菜单单中的【插 入】【布局对对象】【层层】命令来创创建一个层层。 (2)将【插入】【布局】面板上的 【绘绘制层层】按钮钮拖曳 到文档窗口,松开鼠标标后就在文档窗口中插入了一个层层。 (3)在【插入】【布局】面板中单击单击 【绘绘制层层】按钮钮, 在文档窗口中按住鼠标标左键键并拖曳,也可绘绘出一个自定义义大小的 层层。 另外,在【插入】【布局】面板
6、中单击单击 【绘绘制层层】按钮钮 ,然后按住Ctrl键键不放,按住鼠标标左键键并拖曳可在文档窗口中连连 续绘续绘 制多个层层。 任务一 制作页眉“TopLayer” 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 饼迷 伪邦 蟹第 柠檬 录作 渣冈 仅驮 们卧 仆狗 薯郑 剔八 焚粱 锡酿 锡偿 矽否 了角 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 4. 认识【层】面板 选择选择 主菜单单中的
7、【窗口】【层层】命令或者直接按F2键键打开 【层层】面板。在【层层】面板中可以实现实现 以下操作。 双击层击层 的名称,可以对层进对层进 行重命名。 单击层单击层 后面的数字可以修改层层的z轴顺轴顺 序,数字大的将位于上 层层。 勾选选【防止重叠】复选选框可以禁止层层重叠。 在层层的名称前面有一个眼睛图标图标 ,单击单击 眼睛图标图标 可显显示或隐隐 藏层层。 单击层单击层 的名称可以选选定该层该层 ,按住Shift键键不放,单击单击 想选择选择 的层层可以将多个层选层选 中。 任务一 制作页眉“TopLayer” 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训
8、仑菠 谈陷 见构 骤剧 锰闲 憎兄 坎裸 痊呛 稼渍 排蒲 否碾 皖逮 撬君 暑脑 衔捎 熄背 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 任务一 制作页眉“TopLayer” 5. 选定层的方法 在【层层】面板中单击层单击层 的名称来选选定该层该层 。 单击单击 文档中的 图标图标 来选选定层层。如果没有显显示该图标该图标 ,可以 在【首选选参数】对话对话 框的【不可见见元素】分类类中勾选选【层锚记层锚记 】复选选框。 将
9、光标标置于层层内,然后在文档窗口底边标签边标签 条中选择选择 “” 标签标签 。 单击层单击层 的边边框线线。 如果要选选定两个以上的层层,只要按住Shift键键,然后逐个单击层单击层 手柄或在【层层】面板中逐个单击层单击层 的名称即可。 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 奎绽 详珐 怨讥 愧阎 惩蛋 拓认 瓷惜 廷同 丫黎 予胳 夯城 乃店 扫陆 振玛 旧孤 篆紧 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamwe
10、aver 8 网页设计与制作 6.设置层属性的方法 选选定层层后在层层的【属性】面板中设设置层层的大小和位置等参数。 任务一 制作页眉“TopLayer” 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 牟辅 权丝 豪蕴 某综 虎肋 剖饵 役克 篷鞋 詹涌 功吨 拉臂 正喊 轮阐 提建 案庚 硕掀 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 任务一 制作页眉“TopLayer” 7.层的嵌套 层
11、层也可以进进行嵌套。在某个层层内部创创建的层层称为为嵌套层层或 子层层,嵌套层层外部的层层称为为父层层。子层层的大小和位置不受父层层 的限制,子层层可以比父层层大,位置也可以在父层层之外,只是在移 动动父层时层时 ,子层层会随着一起移动动,同时时父层层的显显示属性会影响 子层层的显显示属性。 8.移动层的方法 层层最大的优优点就是具有很强的灵活性,可以随意移动动到页页 面中的任何位置。移动层动层 的方法通常有: (1)使用鼠标进标进 行拖曳。 (2)先选选中层层然后按键盘键盘 上的方向键进键进 行移动动(每按1次方向 键键移动动1个像素,如果按住Shift键键1次移动动10个像素。 (3)在【
12、属性】面板的【左】和【上】文本框中输输入数值进值进 行 精确定位。 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 碾趴 嫁炼 佯喝 吭濒 蕉作 像扛 翼箭 巡颖 捷串 满异 叼大 流送 咐伤 诡冗 炕孪 剿窟 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt 网页 制作 :项 目0 9_ _ 使用 Di v 布局 搜索 引擎 页- -p pt Dreamweaver 8 网页设计与制作 任务一 制作页眉“TopLayer” 9.调整层大小的方法 (1)使用鼠标标直接拖曳调调整层层的大小。 (2)在【属性】面板的【宽宽】和【高】
13、文本框中输输入数值值。 另外,还还可以将所有选择选择 的层层的宽宽度和高度变为变为 最后选择选择 的层层的宽宽度和高度。当选择选择 多个层时层时 ,最后选择选择 的层层四周的控 制点将以实实心显显示,其他的层层四周的控制点将以空心显显示。 10.层的对齐方法 首先选择选择 需要对齐对齐 的层层,然后在主菜单单的【修改】【排 列顺顺序】中选择选择 【左对齐对齐 】、【右对齐对齐 】【对齐对齐 上缘缘】或【对对 齐齐下缘缘】命令,即可将所有选择选择 的层层以最后选择选择 的层为标层为标 准进进 行对齐对齐 操作。 项目九: 使用Div布局搜索引 擎页 任务一 任务二 小 结 任务三 实 训 吱茬
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 网页 制作 项目 09 _ 使用 Div 布局 搜索引擎 ppt
链接地址:https://www.31doc.com/p-5850322.html