天极传媒:
天极网
比特网
IT专家网
52PK游戏网
极客修
全国分站

北京上海广州深港南京福建沈阳成都杭州西安长春重庆大庆合肥惠州青岛郑州泰州厦门淄博天津无锡哈尔滨

产品
  • 网页
  • 产品
  • 图片
  • 报价
  • 下载
全高清投影机 净化器 4K电视曲面电视小家电滚筒洗衣机
您现在的位置: 天极网>新闻>

用FP2000作网页---CSS之二

CPCW 2000-03-31 00:00 我要吐槽
b>三.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 鹪谟冢蘼鄹猛呈欠裼τ昧瞬愕奖恚冀寥《ㄒ搴玫牟愕奖怼6鳯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编辑层叠样式表还是非常简单和高效的。

作者:田涛 责任编辑:)
请关注天极网天极新媒体 最酷科技资讯
扫码赢大奖
评论
* 网友发言均非本站立场,本站不在评论栏推荐任何网店、经销商,谨防上当受骗!
笔记本手机数码家电