用FP2000作网页---CSS之二
作者：田涛
来源：
日期：2002-6-18
三.CSS的分类
CSS分为三种类型，也就是它应用在HTML语言中的三种方式：
1.内联层叠样式表
内联层叠样式表是针对某一个HTML标签采用的CSS设置，该层叠样式表代码处于该HTML
标签代码中，而不是处于$#@60;head$#@62;$#@60;/head$#@62;间，也就是说该CSS只对该标
签起作用，而不影响其它标签，比如：$#@60;h1 style="margin-left: 7"$#@62;读者，你
好！$#@60;/h1$#@62;，你可以在点选编辑窗口的HTML选项卡查看源代码来了解内含式CSS的
应用方法。你也可以人工修改该代码。
2.嵌入层叠样式表
嵌入式层叠样式表是针对某一个网页的全面设置，和内联式层叠样式表不同，嵌入层叠
样式表对整个网页起作用。该层叠样式表代码一般放置于
$#@60;head$#@62;$#@60;/head$#@62;之间。比如我们为H1设置了样式后，那么网页中所有
用到H1的标签都将被影响。比如：
$#@60;html$#@62;
$#@60;head$#@62;
$#@60;style$#@62;
$#@60;!--
h1 { font-size: 10.5pt; margin-left: 30px }
--$#@62;
$#@60;/style$#@62;
$#@60;/head$#@62;
$#@60;body$#@62;
$#@60;h1$#@62;TIANTAO$#@60;/h1$#@62;
$#@60;h1$#@62;CHINA$#@60;/h1$#@62;
$#@60;/body$#@62;
$#@60;/html$#@62;
3.外部层叠样式表
有些时侯，我们想为站点的所有网页都应用相同的样式，如果把相关的层叠样式表代码
逐个插入到不同页面中，势必非常麻烦。这时侯，我们可以利用CSS的外部连接，把层叠样
式表代码保存为一个后缀名为.css的文件，然后利用$#@60;LINK REL=stylesheet
TYPE="text/css" Href="样式文件的位置"$#@62;代码插入到不同网页中就可以共享相同的
CSS了，以后可以修改该文件就能改变所有网页的外观了。该代码也放置在
$#@60;head$#@62;$#@60;/head$#@62;中。
外部层叠样式表完全格式：
$#@60;html$#@62;
$#@60;head$#@62;
$#@60;
$#@60;link rel="stylesheet" type="text/css" href="层叠样式表位置"$#@62;
$#@60;/head$#@62;
$#@60;body$#@62;
$#@60;/body$#@62;
$#@60;/html$#@62;
还有一种方法可以引入CSS文件，就是利用@importURL {"层叠样式表位置“}；它也放
置与$#@60;style$#@62;$#@60;/style$#@62;间，它和LINK 鹪谟冢蘼鄹猛呈欠裼τ昧
瞬愕奖恚冀寥《ㄒ搴玫牟愕奖怼６鳯INK方式在该网页没有应用层叠样式表
时，不会读取该层叠样式表。
*在FrontPage2000中建立外部层叠样式表：
在应用外部层叠样式表前，先利用文本编辑器编写层叠样式表代码，然后保存后缀名
为.css的文件，注意该文件不包含$#@60;style$#@62;$#@60;/style$#@62;标签。
在网页编辑窗口，点选菜“格式/样式表链接”打开“链接样式”窗口，在设置窗口有
两个选项“所有网页”和“所选的网页”，它们是让你选择该样式表应用的网页，是所选择
的网页，还是整个站点的网页。一般情况下，它们在你利用FrontPage2000编辑一个站点时
有效。单击添加，在选择文件窗口找到层叠样式表文件，单击确定，这样该层叠样式表文件
被应用到该网页。
对于一个网页你也可以同时应用几个层叠样式表文件，这种情况一般为了以后修改方
便，比如把不同样式分别存为CSS文件，然后分别添加应用到网页。
四.FrontPage2000层叠样式表格式设置
在上面我建立类提到过格式的设置，这里我们简单介绍一下。
字体：
在字体窗你可以设置文本的属性，比如字体，字型，大小，颜色，效果，字符间距等。
对于选择的设置可以在预览窗口看到最后的结果；
段落：
设置段落的属性，比如对齐方式，行距大小等。
边框：
设置选定文本是否出现环绕的边框，就好像该文本套在表格中一样。在这里你可以设置
该边框的样式和颜色，大小等等。
编号方式：
该设置只能利用到项目符号和编号上，不能用于一般的文本。
定位：
这是样式中比较重要的概念，它能定义一段文本相对或者绝对定位于网页，并能利用Z
坐标制作出层叠效果的网页，Z坐标是除X，Y坐标出现的第三种有三维空间的坐标，利用Z坐
标能作出许多特殊效果的网页出来。而“相对定位”是指定义的内容会根据浏览器的大小自
动调整大小，而“绝对定位”是无论浏览器如何改变，所定义的内容的显示方式都不将改
变。定位用到的两个标签是$#@60;DIV$#@62;和$#@60;SPAN$#@62;，暂时大家可以不去了解
它们，FrontPage2000能完成一切你需要的定位样式。定位样式一般用在文本与图片的环绕
上。
五.FrontPage2000层叠样式表的修改
在编辑窗口，点选菜单“格式/样式表”，在打开的样式窗口，选择一个定义好的样式
名称，然后点修改，在修改窗口更改设置，点击确定，网页中应用了该类的层叠样式表将被
应用新的样式。
六.FrontPage2000层叠样式表的其它应用
1.层叠样式表的继承性
层叠样式表的继承性的继承性是指，被包含的HTML标签将拥有包含它的HTML标签的层叠
样式表所有内容。比如：
html$#@62;
$#@60;head$#@62;
$#@60;style$#@62;
$#@60;!--
h1 { font-size: 10.5pt; margin-left: 30px }
--$#@62;
$#@60;/style$#@62;
$#@60;/head$#@62;
$#@60;body$#@62;
$#@60;h1$#@62;TIANTAO$#@60;B$#@62;CHINA$#@60;B$#@62;$#@60;/h1$#@62; /*在
$#@60;B$#@62;$#@60;/B$#@62;中的内容将继承$#@60;H1$#@62;所定义的样式内容。*/
$#@60;/body$#@62;
$#@60;/html$#@62;
2.层叠样式表的优先顺序
我们了解到层叠样式表分为三种类型，当它们都被应用和发生冲突的时侯如何应用呢。
这就需要层叠样式表有优先顺序，一般来说它们的优先顺序是：内联层叠样式表/嵌入层叠
样式表/外部层叠样式表
3.层叠样式表的注释
层叠样式表的注释的格式为：/* 注释内容 */
4.层叠样式表的分组
当几个不同HTML标签设置相同的层叠样式表时，就可以利用层叠样式表的分组，比
如：
h1,h2,h3,h4,h5,h6 {color:red}
上面的分组说明六个标题采用相同的样式颜色，不同标签用逗号隔开。
5.层叠样式表所涉及的单位
层叠样式表的应用中会遇到一些单位，下面简单介绍下：
in:英寸
cm：厘米
mm：毫米
px：像数
pt：以印刷点数为单位(Typeface Point=1/72in)
pc: 以磅为单位(1Pica=12pt)
ex: 以当前字体的大写字母X的高度为单位指定某个高度
em: 以当前字体的小写字母M的高度为单位指定某个高度
层叠样式表是网页制作中非常重要的一个应用手段，虽然对于层叠样式表具体的代码
你可能不了解，但利用FrontPage2000你无需去关心那些底层的东西，就能制作出更丰富多
采的网页效果来，层叠样式表也是未来格式化网页重要的手段之一。当然在FrontPage2000
中，层叠样式表的应用并不十分方便，比如你无法利用FrontPage2000直接编辑一个后缀为
CSS的文件，你需要先按照嵌入式建立好层叠样式表，然后复制到一个文本编辑器里，删除
style,然后再保存为CSS文件，虽然如此，利用FrontPage2000编辑层叠样式表还是非常简单
和高效的。
