• 日志
  • 教程
  • 插件
  • 设计
  • 欣赏
  • 资源
  • 地图
精灵日志图片

在Dreamweaver中使用样式表

作者:梦觉

二、          定义样式表选项。

启动新建样式表后会打开如图四所示的对话框:

(图四)
(一)首先看一下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>标签包围的文本将不使用这个样式。

(图十一)
2)利用这个功能我们还可以定义两种以上的链接样式风格,具体步骤如下:

第一页|第二页|第三页|第四页

 

教程-Tutorials
FireworksMX2004教程
Fireworks教程
Dreamweaver教程
©2000-2006 Bitgenius.com.All rights reserved. Designed by Mengjue.