IE 的 F12 开发者工具 - 添加新的 CSS？答案

【问题标题】：IE's F12 Developer Tools - add new CSS?IE 的 F12 开发者工具 - 添加新的 CSS？
【发布时间】：2011-07-04 09:53:20
【问题描述】：

我正在使用 IE 的 F12 开发人员工具查看元素。我可以看到应用于元素的样式，因此我可以更改或禁用它们，但是如何添加全新的样式？

谢谢

【问题讨论】：

你能把接受的答案改成最佳答案吗？
@stefan.s IE8 没有与接受的答案相同的选项，当时 IE8 是被询问的浏览器。最好编辑此问题的标题以指定 IE8，然后提出（并回答）专门针对 IE9/10/11 的问题。原则上，虽然我同意接受的答案现在可能已经过时，但我已经澄清我的答案是针对旧版浏览器的。

标签： internet-explorer internet-explorer-8 ie-developer-tools

【解决方案1】：

在 IE9 中，您可以选择 CSS 选项卡，然后右键单击以添加新的样式规则。

在 IE11 中，您需要选择 DOM Explorer 选项卡，然后选择右侧的 Styles 选项卡。然后可以右键添加新的样式规则。

【讨论】：

确实，完美的答案。
同理，只是默认移到了右侧的样式选项卡。类似于它在 Chrome 中的位置。
@Zack 刚刚添加了 IE11 的说明。
在 IE 中，每当我尝试在 Styles 选项卡中添加内联样式时，它会立即被一条线划掉。有时，如果我右键单击 HTML 并选择“添加属性”...

【解决方案2】：

对于 IE8/IE9，您可以将 style 属性添加到元素并内联添加任何 CSS 属性。只需右键单击元素并选择添加属性。正如评论的那样，这只会给一个元素添加样式。

对于 IE10/11，请参阅other answer。

【讨论】：

这行得通，除非我想将样式应用于类或 id，而不是 1 个元素。谢谢

【解决方案3】：

如果 IE 没有找到您悬停在光标上的元素，这可能是因为在页面已经生成之后，部分 HTML 代码正在使用 Ajax 或其他类似技术加载。如果是这种情况，您将不得不关闭检查器，重新加载页面，执行所有必要的步骤来显示您感兴趣的元素，然后才能再次打开检查器。现在，当您将其悬停时，它应该会找到您的元素，以便您可以检查它是否需要任何内容。

【讨论】：

【解决方案4】：

单击开发人员工具中的属性选项卡。你可以在那里添加css。

【讨论】：