Dreamweaver CC教程：CSS Designer

CSS Designer
CSS Designer 面板 (Windows > CSS Designer) 属于 CSS 属性检查器，能让您“可视化”地创建 CSS 样式和规则并设置属性和媒体查询。
可以使用 Ctrl/Cmd+ Z 撤消或使用 Ctrl/Cmd + Y 还原您在 CSS Designer 中执行的所有操作。更改会自动反映在“实时”视图中，相关 CSS 文件也会刷新。为了让您觉察到相关文件已更改，受影响文件的选项卡将在一段时间内（约八秒）突出显示。

CSS Designer 面板

CSS Designer 面板由以下窗格和选项组成：
全部 列出与当前文档关联的所有 CSS、媒体查询和选择器。您可以筛选所需的 CSS 规则并修改属性。还可以使用此模式开始创建选择器或媒体查询。
此模式对选定内容不敏感。这意味着当选择页面上的元素时，关联的选择器、媒体查询或 CSS 不会在 CSS Designer 中突出显示。
当前 列出当前文档的“设计”或“实时”视图中所有选定元素的已计算样式。在“代码”视图中将此模式用于 CSS 文件时，将显示处于“焦点”状态的选择器的所有属性。
此模式是上下文相关的。使用此模式来编辑与文档中所选元素关联的选择器的属性。
源 列出与文档相关的所有 CSS 样式表。使用此窗格，您可以创建 CSS 并将其附加到文档，也可以定义文档中的样式。
@媒体 在“源”窗格中列出所选源中的全部媒体查询。如果您不选择特定 CSS，则此窗格将显示与文档关联的所有媒体查询。
选择器 在“源”窗格中列出所选源中的全部选择器。如果您同时还选择了一个媒体查询，则此窗格会为该媒体查询缩小选择器列表范围。如果没有选择 CSS 或媒体查询，则此窗格将显示文档中的所有选择器。
在“@媒体”窗格中选择“全局”后，将显示对所选源的媒体查询中不包括的所有选择器。
属性 显示可为指定的选择器设置的属性。有关详细信息，请参阅设置属性。
如果您在 CSS Designer 中展开或折叠窗格，窗格的大小在会话中保持不变。“源”和“媒体”窗格会保持自定义大小，直到您再次更改其大小。
注意：选择某个页元素时，在“选择器”窗格中选择最具体的选择器。要查看特定选择器的属性，请在窗格中单击该选择器的名称。
若要查看所有选择器，可以在“源”窗格中选择“所有源”。若要查看不属于所选源中的任何媒体查询的选择器，请在“@媒体”窗格中单击“全局”。

来源：dreamweaver官网

上一篇：Dreamweaver CC教程：可视化参考线概述

下一篇：Dreamweaver CC教程：“文件”面板概述