“应用样式”任务窗格

项目
10/11/2017

使用“应用样式”任务窗格，可以应用、取消、修改、重命名和删除样式，可以附加或取消外部级联样式表 (CSS)，可以选择样式的所有实例，也可以转到包含样式的规则集的代码。“应用样式”任务窗格会按照样式的规则来显示每种样式，因此只需查看样式的可视外观，即可快速识别出所要应用的样式。

打开网页后，“应用样式”任务窗格会列出该网页的所有级联样式表 (CSS) 中定义的样式，包括外部、嵌入式和内部 CSS 中定义的样式。类和 ID 选择器显示在包含该样式的外部 .css 文件的名称之下，如果该样式包含在内部 CSS 中，则显示在“当前网页”之下。元素选择器以相同的方式组织，但显示在类和 ID 选择器列表下名为“上下文选择器”的独立标题之下。可以设置该任务窗格，使其列出所有样式，或者对其加以限制以便仅列出当前网页或网页的当前所选内容中使用的样式。无论选择了何种选项，均只有在将光标移到使用元素选择器和级联选择器的内容中或者选中使用此样式的内容时，元素选择器和级联选择器才会显示在该任务窗格中。

可以对“应用样式”任务窗格中显示的样式列表进行排序，也可以对其加以限制以便仅显示当前网页或当前所选内容中使用的样式。如果特定的样式在该任务窗格的白色背景下很难看清，可以选择一种颜色，使其成为该任务窗格中不包含背景属性的样式的背景色。

提示：
若要临时在指针所处的浮动窗口中显示某种样式的所有规则，请在“应用样式”任务窗格中指向该样式。

“应用样式”任务窗格

Cc295403.101cc829-ecf8-4ef8-aeb3-4b8e52171b01(zh-cn,Expression.10).bmp

清除样式用于从当前所选内容删除所有类选择器和级联样式。
当前网页用于列出内部 CSS 和导入的外部 CSS 文件中的类和 ID 选择器。
已导入到当前网页中的外部 CSS 文件。
当前网页的内部 CSS 中定义的样式。
从当前网页链接到的外部 CSS 文件。
围绕在当前所选内容使用的样式周围的实心矩形边框。
上下文选择器用于列出当前所选内容使用的元素选择器。
链接的外部 CSS 文件 (events.css) 中包含的类和 ID 选择器。
每种样式均有一个下拉菜单，用于执行许多与样式相关的任务。指向样式并单击箭头，或者双击样式，即可显示该菜单。

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

“应用样式”任务窗格图标

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

过程

对“应用样式”任务窗格中的样式列表进行排序

在“应用样式”任务窗格中，单击“选项”，然后执行下列操作之一：
- 若要按照各种样式在 CSS 中出现的顺序列出这些样式，请选中“按顺序分类”。
- 若要按照字母顺序和样式的类型（类或 ID 选择器）列出样式，请选中“按类型分类”。

在“应用样式”任务窗格中显示或隐藏样式

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

若要列出当前网页的外部、内部和嵌入式 CSS 中包含的所有样式，请选中“显示所有样式”。
若要仅列出当前网页中使用的样式，请选中“显示当前页面中使用的样式”。
若要仅列出网页的当前所选内容中使用的样式，请选中“显示选择的内容使用的样式”。

说明：
只有将光标移到使用元素选择器和级联样式的内容中或者选中使用这些样式的内容时，元素选择器和级联样式才会显示在“应用样式”任务窗格中。