您可以在 Chrome Inspector 中添加新的 CSS 属性吗?
是否可以在 Chrome 检查器中添加新的 CSS 属性?看来您只能编辑现有属性。
另外,一旦你编辑了属性,有没有办法整体查看修改后的CSS?
Is it possible to add new CSS properties in the Chrome inspector? It seems that you can only edit existing properties.
Also, once you edit the properties, is there a way to view the revised CSS as a whole?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
是的,可以在 Chrome 检查器中添加新的 CSS 属性,并通过几个简单的步骤查看它们:
Yes, it's possible to add new CSS properties in the Chrome inspector and review them in a few easy steps:
您可以在规则中双击添加新属性。您也可以从角落的滚轮添加新规则,然后选择“新样式规则”。
要查看整个修订后的文档,请访问:
Resources >框架>站点名称>样式表> stylesheet-name.css
或者只需单击 css 属性上方的 + 符号
You can add new property in a rule double clicking within the rule. Also you can add a new rule from the wheel in the corner and then select "New Style Rule".
To view the whole revised document go to:
Resources > Frame > site name > Stylesheets > stylesheet-name.css
Or simply Click the + symbol above the css properties
只需双击“样式”面板中的任何白色和空白区域即可。
我倾向于双击
}
右侧来编辑我想要编辑的 CSS 规则。请参阅@Sotiris 的回答。
据我所知。可能有一个扩展可以做到这一点,但如果存在,它可能不会保留原始格式的精确格式CSS。Simply double-click in any white and empty space in the "Styles" panel.
I tend to double-click to the right of the
}
for whichever CSS rule I want to edit.See @Sotiris's answer.
Not that I know of.There may be an extension that can do this, but if one exists, it probably won't preserve the exact formatting of your original CSS.为什么不呢?以下是 Google Chrome 检查器的
Styles
面板的屏幕截图注意该块:
您只需在该区域单击鼠标,检查器将为您提供添加新样式的机会。如果您需要向元素添加新属性,请在
Elements
面板中右键单击该元素,然后选择“添加属性”。Compated Style
面板没有为您提供此信息吗?在那里,您可以检查应用于节点的所有样式,实际上,它们是按照什么规则以及从什么样式表应用的。Why not? Here is the screenshot of the
Styles
panel of the Google Chrome inspectorNotice the block:
You just click with mouse in that area and inspector will give you an opportunity to add new styles. If you need to add a new attribute to an element, you right click on it in the
Elements
panel and choose 'Add attribute'.Doesn't
Computed Style
panel give you this information? There you can check al lthe styles applied to a node and, actually, in what rule and from what stylesheet they are applied.