“管理样式”任务窗格

项目
10/11/2017

使用“管理样式”任务窗格，可以应用、修改、重命名和删除样式，可以附加或取消外部级联样式表 (CSS)，可以选择样式的所有实例，也可以转到包含样式的规则集的代码。也可以使用“管理样式”任务窗格在外部 CSS 和内部 CSS 之间移动样式，或者在 CSS 中移动某个样式的位置。

打开网页后，“管理样式”任务窗格会列出该网页的外部和内部级联样式表 (CSS) 中定义的样式，但不会列出嵌入式 CSS 中定义的样式。可以设置该任务窗格，使其列出所有样式，或者对其加以限制以便仅列出当前网页或网页的当前所选内容中使用的样式。所有类、元素和 ID 选择器都显示在包含该样式的外部 .css 文件的名称之下，如果该样式包含在内部 CSS 中，则显示在“当前网页”之下。

提示：
若要临时在指针所处的浮动窗口中显示某种样式的所有属性声明，请在“管理样式”任务窗格中指向该样式。

“管理样式”任务窗格

Cc295470.43e2a2bf-87b3-49a4-ac55-1211d2fbb028(zh-cn,Expression.10).bmp

当前网页用于列出内部 CSS 和导入的外部 CSS 文件中的类、元素和 ID 选择器。
已导入到当前网页中的外部 CSS 文件。
当前网页的内部 CSS 中定义的样式。
从当前网页链接到的外部 CSS 文件。
默认情况下，如果某种样式包含多个选择器，则分组显示。可以单击“选项”，再单击“分隔分组选择器”，从而分开列出这些选择器。

“管理样式”任务窗格中每种样式旁边显示的图标可指示样式的类型以及当前网页中是否使用了该样式。

“管理样式”任务窗格图标

图标	描述
	ID 选择器旁显示一个红点。
	类选择器旁显示一个绿点。
	元素选择器旁显示一个蓝点。
	彩色圆点周围的圆圈表示当前网页使用了这种样式。
	导入的外部级联样式表旁将显示 @ 符号。

移动样式

在“管理样式”任务窗格中，单击“选项”，再选中“按顺序分类”。

请执行下列操作之一：

若要在 CSS 中移动样式的位置，请在列表中向上或向下拖动该样式。例如，可以移动最常用的样式，以便显示在一起。
若要将样式从内部 CSS 移到附加到该网页中的外部 CSS 中，请将该样式从“当前网页”之下拖放到要包含该样式的外部 CSS 的名称上，或者拖放到该外部 CSS 的样式列表中的特定位置。
若要将样式从外部 CSS 移到内部 CSS 中，请将该样式从外部 CSS 的名称之下拖放到“当前网页”上，或者拖放到“当前网页”下的样式列表中的特定位置。如果未显示“当前网页”，请在网页的 <head></head> 标记之间添加一对 <style></style> 标记。
若要将样式从一个外部 CSS 移到另一个外部 CSS 中，请将该样式拖放到要包含该样式的外部 CSS 的名称上，或者拖放到该外部 CSS 的样式列表中的特定位置。

说明：
当“管理样式”任务窗格在“选项”任务窗格中设置为“按元素分类”或“按类型分类”时，不能将样式移到样式列表中的特定位置。选中这两个选项之一时，只能通过将样式拖放到外部 CSS 文件的名称或“当前网页”（表示内部 CSS）上，将该样式从外部 CSS 移到另一个外部 CSS 或内部 CSS 中，或者反向移动。

当“管理样式”任务窗格在“选项”任务窗格中设置为“按元素分类”或“按类型分类”时，不能将样式移到样式列表中的特定位置。选中这两个选项之一时，只能通过将样式拖放到外部 CSS 文件的名称或“当前网页”（表示内部 CSS）上，将该样式从外部 CSS 移到另一个外部 CSS 或内部 CSS 中，或者反向移动。

对“管理样式”任务窗格中的样式进行排序

在“管理样式”任务窗格中，单击“选项”，然后执行下列操作之一：

具体选项	操作
按顺序分类	按照样式在 CSS 中显示顺序列出样式。
按元素分类	在应用了样式的 HTML 元素下列出各种样式。
按类型分类	按字母顺序和样式的类型列出样式。

对包含多个选择器的样式分开列出其各个选择器

在“管理样式”任务窗格中，单击“选项”，再选中“分隔分组选择器”。

在“管理样式”任务窗格中显示或隐藏样式

在“管理样式”任务窗格中，单击“选项”，然后执行下列操作之一：

具体选项	操作
显示所有样式	列出当前网页的外部、内部和嵌入式 CSS 中包含的所有样式。
显示当前页面中使用的样式	仅列出当前网页中使用的样式。
显示选择的内容使用的样式	仅列出网页的当前所选内容中使用的样式。