dw基础教程.docx

dw基础教程.docx

《dw基础教程.docx》由会员分享，可在线阅读，更多相关《dw基础教程.docx（13页珍藏版）》请在冰豆网上搜索。

dw基础教程

Dreamweaver》

第二节：

学习Dreamweaver的作用和应用方向

第三节：

认识DW勺界面

第四节：

站点的建立和编辑

第五节：

常用插入

第六节：

csS羊式

1.作用

2.CSS样式的应用对象

3.CSS样式的分类

4.如何将样式表加入网页？

5.实验后总结优先级

6.CSS规则简单说明

7.块元素（block）的定义

8.CSS规则详解一类型

9.CSS规则详解一背景

10.CSS规则详解一区块

11.CSS规则详解一方框

12.CSS规则详解一边框

13.CSS规则详解一列表

[块内字的规则]

[块本身]

[块内元素的对齐和排版]

[块本身][块内][块间]

[块本身]

14.CSS规则详解一定位

15.CSS规则详解一扩展[块内]

第七节：

CSS+DIV$；例网页布局

1.盒子模型

2.当间距（边界距离）叠加的说明

3.CSS+DIV^局的精髓

4.CSS排版理念

第八节：

行为

1.定义

2.行为的“埋设”

3.常用触发条件

4.常用事件演示

第一节：

DWM牛介绍

DreamWeave是一款网页排版软件，可以方便的进行网页布局。

是由ADOBE公司生产的，

ADODB公司有多款针对电脑设计的软件，如：

第二节：

学习Dreamweaver的作用和应用方向

主要作用：

①快捷的网页排版布局。

②智能化网页辅助设计。

应用方向：

网站的制作和测试。

第三节：

认识DW勺界面

1.常用面板、属性栏

2.工作区模式切换开关

a）代码——HTML编码方式

b）设计——最终显示的结果（所见即所得）

c）拆分——以上两者皆有

3.标签选择器

a）可以显示HTML标签的层次关系。

b）可以快速选择并编辑HTML标签。

4.预览按钮

a）可以在IE中测试最终结果，快捷键（F12）

第四节：

站点的建立和编辑

1.DW中不能直接创建网页，那样得到的路径会是绝对路径。

我们

必须首先要创建站点，并在站点管理器中，创建和管理HTML网页。

2.它的好处：

a）自动使用相对路径。

b）所有网页文件都存在一个固定文件夹下，便于管理。

c）通过DW的文件管理面板可以直观看到网站中各个文件的

状态。

第五节：

常用插入

1.超级链接

通过给文字或者图片增加一个“点击出口”，当它们被点击后即

可以跳转到指定的位置。

我们可以设置其打开属性，_blank新窗口打开_self当前窗口。

2.邮件链接

格式：

mailto:

E-MAIL地址

3.锚点

通过在当前页面内设置标记，可以在当前页面内超链接进行跳

转。

格式：

#锚点名

4.表格

a）行、列、表格的宽度。

b）边框粗细，如果为0，则表格为边线隐藏。

c）单元格边距（填充）：

指单元格内元素到单元格边的距离。

d）单元格间距：

指两个单元格之间的距离。

e）表格的属性均是通过属性面板来调整的，我们可以任意调整某

一行或列或者单元格的属性。

f）表格元素的选择

我们选择表格元素（表格、行、单元格），需使用标签选择器

来选择，table（表格本身），td（单元格），tr（行）。

g）表格是可以嵌套的，即一个单元格里还可以插入新表格。

h）表格一般只能竖排不能横排。

5.图片、图片占位符、鼠标经过图像

a）图片：

一般只设置宽高

b）图片带超级链接中替换的意思是当鼠标指上以后的文字提示或

当图片不显示时的文字提示。

6.图片热点

可以给一张图片的不同位置，增加不同的超级链接。

7.FLASH

必须是*.swf格式文件

第六节：

csS羊式

1.作用

a）层叠样式表，用来规范网页中元素的显示样式，使之在任何浏

览器下都显示一样的结果，并不随浏览器的设置而改变。

2.CSS羊式的应用对象

a）只能应用于HTML标签。

3.CSS羊式的分类

a）类样式：

可以定义一组样式规则，并将它应用于不同的标签。

i.定义时以点开头

ii.不能和HTM而签名字重复

iii.不能是中文和纯数字，可以是字母加数字。

b）标签样式：

规定某一个HTML标签的样式规则，重定义HTML标

签。

1.不需要命名，只需要在下拉菜单中直接选择要改变的标签。

c）总结：

类样式定义好后，要赋于标签才能生效，并且不影响其

主要功能。

而标签样式定义好后，直接生效，并且将整个页面

所有此类标签都即时改变。

d）高级样式：

i.ID选择器：

对拥有ID的HTM面签进行规则设定。

以#号开头#目标ID

基本属性和类样式相似，操作不同，它需要先

给HTM麻签设定一个ID,格式是id='名字'

多用于DIV（层）标签

ii.包含选择器

对于特定的HTMLB签组合规定其样式，例如：

bi，单独的b和单独的i均不受影响。

iii.选择器组

当有一组HTML标签有统一的规则，我们可以将

它们规定在一起，以节省代码输入。

格式是：

名1，名2，名3

iv.伪类选择器

控制超级链接的动态样式，即可以通过它来设

定具有动态效果的超级链接外观。

a:

link平常的样子

a:

visited访问过的样子

a:

hover当鼠标滑上的样子

a:

active当点击时的样子（无用处）

如果希望定义多组不同的链接样式，我们可以

用以下方法：

a.名字:

link（一组的名字必须一致）

4.如何将样式表加入网页？

a）行内式：

通过style属性直接定义在HTML标签属性内，当有多

个CSS属性时用分号分隔，要求大家具备很高的CSS弋码水平。

b）内嵌式：

在当前页面head内生成一段CSS代码，只对当前页面

生效。

c）链接式：

将CSS羊式单独放于一个文件内＜*.CSS＞,通过包含页面的形式，链接入本页面。

可以链接到不同的页面，可以减少代

码的输入量。

5.实验后总结优先级

a）而最接近目标的样式定义优先权越高，高优先权样式将继承低

优先权样式的未重叠定义但覆盖重叠的定义。

b）ID选择器＞类样式＞标签样式

6.CSS规则简单说明

a）类型

用来定义块元素内文字属性。

b）背景

用来定义块元素的背景属性。

c）区块

一个块元素内的排列属性。

d）方块

一个块元素本身的属性。

e）边框

给一个块元素加边框。

f）列表

定义有序号排列和无序号排列标签，可以用自定义图片替换项

目符号

g）定位

层（DIV）属性的设定

h）扩展

实现鼠标指针控制和CSSJ1镜

7.块元素（block）的定义

a）块元素（block）可以理解为在DW中呈矩形的区域，均可认为是

块。

b）块具有容器性，我们可以把块容器元素想象成一个个box,比如

剪贴文载，我们先把需要的文章从各种报纸、杂志上剪下来。

每块剪下来的内容就是一个block。

然后我们把这些纸块按照自

己的排版意图，用胶水重新贴到一张空白的新纸上。

这样就形

成了你自己独特的文摘快报了。

作为一种技术的延伸，网页布

局设计也遵循了同样的模式。

c）作为块元素，它一般具有块内、块间、块本身三个属性。

d）一般来说所有的HTM而签均可以看成块。

8.CSS规则详解一类型［块内字的规则］

a）难点1：

字体行高的理解。

b）难点2：

一般网页的字体大小（9pt—12pt）。

c）难点3：

字体样式的赋予。

i.不要直接将样式加给字，而要加给字所在块的块标签。

ii.要先定义规则，再进行赋予。

9.CSS规则详解一背景［块本身］

a）定义背景色和背景图片。

b）默认为X,Y方向平铺，可以单独设置是否重复。

c）在不完全重复的情况下，可以设定背景在块中的位置。

d）附件属性的意思？

10.CS硼则详解一区块［块内元素的对齐和排版］

a）重点1：

掌握字母间距的设定。

b）重点2：

文本对齐指的是块的水平对齐方式。

c）重点3：

垂直对齐属性对段落和层均不生效，只对表格和图文管

用。

d）重点4：

显示属性意思是块以什么方式显示，我们只需知道无和块的意思即可。

11.CSSM则详解一方框［块本身］［块内］［块间］

a）如果只定义宽和高一个属性得到的就是等比例变化或弹性变化。

b）难点1:

浮动属性的意思是块的环绕方式，类似于WORD的图文

混排。

对于块容器如DIV,则是如设置浮动，则块一侧空间会被横向充填，如果下面的块填补不进，则自动向下浮动。

c）DIV标签，又叫层标签，它就代表一个块容器，除了名字（ID）,

没有其他属性，它的属性全靠CSS来设定。

它使用高级样式中的ID样式来设定规则。

#层ID“ID唯一”

i.DIV层在默认情况下，只能竖排，不能横排。

ii.CSS中浮动属性，可以让DIV层横排，解释是从哪边开始横向排列。

iii.层必须是有一个大的父层，这样才能分配空间，否则无

法很好的实现浮动属性的，如果宽度足够，则可以横向排

列。

d）难点2：

浮动清除属性意思是清除其他的层浮动对自身的影响。

e）难点3:

填充距离和边界距离

12.CSSM则详解一边框［块本身］

a）可以自定义块级元素四周的边框。

13.CS硼则详解一列表

a）HTML®目符号标签

b）不仅可以定义字符项目符号，还可以定义图片项目符号。

c）通过设定