在Dreamweaver中使用样式表

2008-02-23 06:15:21来源：互联网阅读 ()

CSS——层叠样式表的使用已变得越来越普及，常见的样式表使用方法有三种：内部样式表文档、外部链接样式表、内部嵌入样式表。关于样式表的优越意义和周详用法连同具体的配置参数不是短短的一篇文章能够说清的。早期创建CSS需要有专门的知识，需要直接编写样式表文档。如今，Dreamweaver使得这项工作能够在一个统一的界面中进行，通过简单的操作即可完成创建、修改、添加等样式表功能，这些配置能够影响到任何事物，从普通的文本布局到复杂的多媒体文档控制。您将会发现通过修改一个单一的外部样式表文档，能够迅速的改变整个站点的外观。今天我们不准备周详讨论任何样式表的具体参数和知识，我们只想给大家介绍在Dreamweaver中使用样式面板直接创建样式表文档的方法。

一、对样式表的操作途径能够有以下三种：
1、从下拉菜单Window—CSS Styles打开样式面板。

2、从下拉菜单Text—CSS Styles启动样式表对话框。

3、在页面空白处点击鼠标右键启动样式表对话框。

不管如何启动上述几个样式菜单或面板，他们都包含相同的几个命令：新建样式表、编辑样式表、链接样式表和导出样式表。下面我们来周详介绍样式的定义。

二、定义样式表选项。
启动新建样式表后会打开如图四所示的对话框：

（一）首先看一下Define选项
1、 New Style Sheet File：此选项将会把您设定的样式最终保存在一个外部单独的样式表文档中，这个样式表文档能够被其他文档一起使用，也就是说您能够使站点内的任何文档使用同一个样式表文档。
2、 This Document Only：此选项将会把您设定的样式仅仅放在当前文档的头文档中，这些样式只能在此文档中使用。
（二）另一个选项是Type：在这里选择将要创建的样式的类型，包括：
1、 Make Custom Style（定制自己的样式类别）：选择此类型后，需要在上方的Name中填入一个样式名字，需要注意的是，此类名称必须以“.”开头。这种方式定义的样式我们能够把他附给绝大多数的HTML对象，这样能够使这些对象有统一的外观。如图五我们创建一个myStyle的样式：

因为上面我们选择的是定义一个外部样式表文档，所以点击OK后打开保存文档的对话框：

选择您的目录和文档名，保存后进入样式配置对话框

这里我们定义了一个字型为宋体，字体大小为12pt，行高为20pt，色彩为深绿色，并带有下化线的样式。
2、 Redefine HTML Tag（重新定义HTML标识）：选择此选项后从上方的Name下拉框里选择需要重新定义的HTML标识。这个选项将使得文档中具备统一标签的任何内容使用相同的外观。例如使任何的段落起始位置缩进两个字能够按照下面的方法重新定义<p>标签

文字的大小等定义同上面的方法，而段落首行缩紧能够按图所示定义：

需要注意的是，假如您的字体定义的为10pt，则这里的首行缩进能够定义为20pt既两个中文字。由于任何的相同类型标签使用的样式相同，所以这种方式适合于大量的相同元素的样式定义，例如对网页中任何的段落统一字体、颜色、大小、行距、段首缩进。
3、 Use CSS Selector（使用CSS选择器）：这个选项的功能是能够设定链接文本的样式

在Selector下拉列表中内定了四个选项:
a:active　——定义链接被激活时的样式，即鼠标已点击了链接，但页面还没有跳转时。
a:hover　——定义了鼠标悬浮在链接文字上时的样式。
a:link　——定义了链接文字的样式。
a:visited　——浏览者已访问过的链接样式。
这个选项有两个功能。
1）一是对具备一定关联组合标签的对象使用指定的样式，例如图十一的配置是：（td p），这表示文档中任何在表格中使用<P>标签包围的文本将使用这里定义的统相同式，而不在表格中的<P>标签包围的文本将不使用这个样式。