Dreamweaver中CSS的应用

2008-02-23 06:00:31来源:互联网 阅读 ()

新老客户大回馈,云服务器低至5折


  Dreamweaver具备强大的编辑层叠样式表(CSS)能力,对层叠样式表的编辑能力要远远强于Frontpage98。虽然Dreamweaver并没有声明对CSS2的支持,但程式本身对层叠样式表的扩展已基本具备了CSS2的基本规范,这一点是其他网页编写软件所不及的。假如不具备这样强大的层叠样式表编辑功能,Dreamweaver在编写DHTML方面的能力会大打折扣,看一看网页的源代码就会知道几乎每一个出色的动画都要靠CSS的参和。当然,要得到理想的显示效果还要有新的浏览器,我在IE4.01下观看Dreamweaver的例页才得到正确的显示结果。我向大家推荐使用4.0的浏览器,特别是IE。

  a6.gif (4946 bytes)a7.gif (8499 bytes)a8.gif (5109 bytes)

  要编辑或管理层叠样式表首先要从window菜单调出样式浮动面板。如图A六所示。这个浮动面板一共显示了三个自定义的样式:style1,style2和style3。浮动面板上显示的样式都不是HTML关键字。改变HTML关键字是隐含的不直接显示在这个浮动面板上。对每一种样式我们都能够进行编辑删除、施加于页面元素等操作。能够通过右击样式的名称来实现上述操作。在将样式施加到页面元素时能够选中样式再向页面加入新的内容或点中所要施加样式的内容,一行或一段,再点中样式。所以假如要进行一般的编辑一定要选中(none)一项。假如我们点样式浮动面板下面的“Style Sheet……”按钮就能够对样式进行编辑。这时弹出一个对话框。如图A七所示。这个对话框列出了增加或改变的任何样式。“p”和“pre”的属性更改后在样式浮动面板中不显示而在这个对话框中将列出来。在这个对话框下部的“Stlyle definition”栏中显示选中样式的配置情况,假如配置内容过多将显示不出来。这个对话框中的“Link”一项指明要配置的样式的外部链接,即一个css文档。假如我们要定义一个新的样式就点“new”键,这时弹出“new style”对话框,如图A八所示。

  a9.gif (7463 bytes)

  a10.gif (5566 bytes)

  通过这个对话框我们能够选择自定义的样式、HTML关键字或CSS选择器提供的各种样式,例图中自定义了一个名为“style1”的新样式。确定以后会自动弹出新的对话框使用户对选定样式进行编辑。这个对话框如图九所示,左边一栏是新样式的各种属性,右面是属性的细节。例图是“type”属性的各种参数。带星号的参数都是扩展的样式属性,现有的浏览器可能不支持。如图A中的“type”属性的参数,我们能够配置字体、字的颜色、字间距、字型及附加线等各种参数值。图A十是以上例子在IE下的显示情况。有关样式表的具体细节十分庞杂,这里不可能作过多的介绍,有兴趣的读者能够参阅有关资料。

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇: 制作个人主页有诀窍

下一篇: DreamWeaver表格应用(细线框的制作)