Dreamweaver 8 样式呈现工具栏惊鸿一瞥

dreamweaver

  原文作者:Adrian Senior

  原文链接:http://www.communitymx.com/content/article.cfm?page=1&cid=EDF1F

  翻译:随风逐月

  Dreamweaver 8有一个非常有趣并很酷的新特性,样式呈现工具栏。

  样式呈现工具栏允许你轻易的为不同的媒体类型,例如屏幕、手持设备和打印输出进行设计。其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型。Dreamweaver 8也提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力。

设置媒体类型

  当然,要使用这些选项查看页面你需要能为它们创建样式表并设置这些样式表的媒体类型。当我们附加样式表到文档中时Dreamweaver 8 会让我们轻易的做到这点,如图1所示。

  图1:新的附加外部样式表对话框

  这里重大的变化就是从媒体选择列表中选择媒体类型的能力。你可以到在“媒体:”选择列表中的所有选项都是可用的。

  我为我的个人站点使用了三个独立的CSS文件:一个用于屏幕,一个用于打印而第三个用于手持设备。这些CSS文件中每一个文件都在每个页面的头部被链接(附加到了页面),如列表1所示。

列表1:使用媒体类型的附加样式表(蓝色突出显示部分)

样式呈现工具栏

  现在让我们看一下样式呈现工具栏——我们稍后探究他的功能。样式呈现工具栏可以在文档工具栏上右击并选择样式呈现工具栏选项进行显示,如图2所示。当关联菜单上的复选标记显示对勾号标记时,工具栏变成激活状态。

  图2:选择样式呈现

  一旦选择的样式呈现工具栏被添加到文档工具栏,它即整装待用。样式呈现工具栏有七个按钮,图3中所示的每个按钮都有自己特定的图例,如下图所示。

  图3:样式呈现工具栏

  1、屏幕
  2、打印
  3、手持设备
  4、投影设备
  5、TTY
  6、TV
  7、打开/关闭CSS

  要激活任意给定的媒体类型你只需点击相应按钮即可。Dreamweaver 8将为你选择的媒体类型加载相应的CSS文件,而页面则将据此呈现。让我们先从使用一个熟悉的视图——屏幕视图开始。这里屏幕视图按钮被用红色突出显示。

  图4:我们页面在屏幕CSS模式下的呈现

  如果仔细观察,你会在图4中看到另一个新功能:我的所有页面元素都有一个虚线轮廓。这让我可以扫一眼就精确查看每个元素的状况。它当然也可以被关闭,但是我喜欢让这个功能一直打开因为它非常的有用。

通过媒体类型转换视图

  既然我们已经在设计视图中打开了页面,那么我们只需要点击媒体类型按钮即可查看我们的页面在不同设备,或真实打印模式上是如何呈现的了。让我们先在打印模式中查看页面。完成此操作我们只需在样式呈现工具栏上点击打印媒体按钮(以红色突出显示部分)。

图5:查看我们页面的打印显示效果

  不错,哈!这节省了大量花在浏览器中加载和预览的时间。我们现在可以轻松设置网页成为友好的打印机并且在我们设计打印样式时就查看页面的显示效果。

  其他的媒体类型同样都是可选择的。你只需为媒体类型定义了样式表并在样式呈现工具栏中选择适当的按钮即可查看在该媒体类型下页面是如何呈现的。当然你可以直接在Dreamweaver 8设计视图中看到结果。我将在手持设备视图完成这个预览。

  我们只需再次选择相应的按钮即可在请求的媒体类型中查看我们的页面呈现。(下图中)样式呈现工具栏上的手持设备媒体类型按钮被用红色突出显示。

图6:在手持设备格式中查看我们的页面

  真是简单得不能再简单了,对吧?你只需建立你的CSS文件并应用页面样式,匹配为之设计的媒体类型即可。Dreamweaver 8将提供优秀的呈现所以你可以精确的看到页面是如何显现的。

  Dreamweaver 8所有的优秀新功能中,样式呈现工具栏是我最喜欢的功能。它省却了为不同媒体类型设计的许多麻烦;事实上它(为我们)节约了大量的时间——数以小时计!

结论

  在这篇预览文章里我们看到了Dreamweaver 8可以读取并呈现基于媒体类型的样式表。而许多人过去可能还没有使用指定设备或打印的层叠样式表,Dreamweaver 8将会让这个转换成为一件简单的事。

时间: 2024-10-27 12:29:32

Dreamweaver 8 样式呈现工具栏惊鸿一瞥的相关文章

就是酷!Dreamweaver 8样式呈现工具栏惊鸿一瞥

dreamweaver  Dreamweaver 8有一个非常有趣并很酷的新特性,样式呈现工具栏. 样式呈现工具栏允许你轻易的为不同的媒体类型,例如屏幕.手持设备和打印输出进行设计.其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型.Dreamweaver 8也提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力. 设置媒体类型 当然,要使用这些选项查看页面你需要能为它们创建样式表并设置这些样式表的媒体类型.当我们附加样式表到文档中时

【白硕】当人工智能遇到区块链,是惊鸿一瞥还是天长地久?

本文将的是当人工智能遇到区块链,是惊鸿一瞥还是天长地久,(白硕)很高兴有这个机会跟大家交流.我先讲几个案例作为引子.第一个案例与知识图谱有关.这个公司做的是非常垂直的一个领域,安全教育.比如驾驶员安全教育,危险品操作,危险品运输,危险品储藏等等.因为国家有规定,有大纲,有考题,有指标来规范从业者,但是很多人只能用碎片化的时间去学习来准备考试.在这种情况下,如果考试不合格的还要回炉,考试成绩还要归档等等.于是,这个公司很聪明,他们做了一个系统,就是把考题的知识点,以及各种关联都呈现给学员,然后还可

Java中关于XML的API惊鸿一瞥

xml 简单介绍一下Java关于xml的API,这样大家看到了缩写就知道是干什么的了.水平有限,多多包涵. 1.JAXP(Java API for XML Parsing) 2.JAXB(Java API for XML Binding) 3.JAXM(Java API for XML Messaging) 4.JAX-RPC(Java API for XML-RPC) 1.JAXP定义了在Java中使用DOM, SAX, XSLT的通用的接口.这样在你的程序中你只要使用这些通用的接口,当你需要

深度|人工智能会有多强大?谷歌AlphaGo不过是惊鸿一瞥

 谷歌的人工智能系统刚刚在围棋游戏中击败人类大师,围棋是一个有着2500年悠久历史的竞赛游戏,较之国际象棋,其策略和智力复杂程度呈指数级增长. Bostrom是牛津大学哲学教授,出生于瑞典,近期畅销书<Superintelligence: Paths, Dangers, Strategies>让这位教授声名鹊起,他在书中探讨了人工智能的好处,也提出这样的主张,一台真实的智能计算机能加速人类灭亡.倒不是说他低估了谷歌围棋机器的力量.他只是认为,这并不一定是一次巨大飞跃.Bostrom指出,多年来

Dreamweaver 8 新功能图文实例讲解

dreamweaver 第一部分:Dreamweaver 8 新功能概述 和Macromedia Studio 8套件中其它软件一样,Dreamweaver 8也增加了许多让我们欣喜不已的新功能,比如更加先进的工作流程,重新设计的CSS工具,改良后的后台FTP,转换XML文件的工具,文档放大功能,插入Flash视频和FlashPaper,代码折叠功能等等. 今天我们先对Dreamweaver 8的新功能进行简单的介绍. 点击这里下载Dreamweaver 8 (59.7MB) 一.工作流程的改进

为什么在DreamWeaver编辑环境中CSS没有效果?

很多朋友在使用DreamWeaver的时候都会遇到这样的情况,如下图. 给当前编辑的文档链接了CSS文件,并对页面元素应用了定义的CSS样式,但在DreamWeaver中却看不到任何效果. 主要原因就是DreamWeaver多出了一个样式呈现工具栏,该工具栏允许你轻易的为不同的媒体类型,例如屏幕.手持设备和打印输出进行设计.其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型.同时还提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力.

CSS在Dreamweaver中无效的解决方法

  很多朋友在使用Deamweaver8的时候都会遇到这样的情况:给当前编辑的文档链接了CSS文件,并对页面元素应用了定义的CSS样式,但在DW8中却看不到任何效果.如下图. 主要原因就是DW8新多出了一个"样式呈现工具栏",该工具栏允许你轻易的为不同的媒体类型,例如屏幕.手持设备和打印输出进行设计.其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型.同时还提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力. 打开&quo

解决Deamweaver8中CSS应用无效问题

css|解决|问题 很多朋友在使用Deamweaver8的时候都会遇到这样的情况:给当前编辑的文档链接了CSS文件,并对页面元素应用了定义的CSS样式,但在DW8中却看不到任何效果.如下图. 主要原因就是DW8新多出了一个"样式呈现工具栏",该工具栏允许你轻易的为不同的媒体类型,例如屏幕.手持设备和打印输出进行设计.其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型.同时还提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力

在DW8中CSS应用怎么没效果?

css 很多朋友在使用DW8的时候都会遇到这样的情况,如下图. 当给当前编辑的文档链接了CSS文件,并对页面元素应用了定义的CSS样式,但在DW8中却看不到任何效果. 主要原因就是DW8新多出了一个样式呈现工具栏,该工具栏允许你轻易的为不同的媒体类型,例如屏幕.手持设备和打印输出进行设计.其他的支持媒体类型有投影设备, TTY(Television Type Devices),以及TV媒体类型.同时还提供了通过开关CSS显示按钮来打开或关闭所有样式呈现的能力. 打开该工具栏的方法是:打开DW8的