Debug CSS

# 调试 CSS

谷歌浏览器的轻量级扩展，用于显示页面上存在的所有元素的轮廓。

在进行网页开发时，困难的部分之一是根据需要定位元素并检查哪个元素影响另一个元素。

这个 chrome 扩展允许用户查看页面每个元素的轮廓。按住键盘 Ctrl 按钮并悬停元素，它将显示元素详细信息和值。

----------

＃ 用法

安装后只需单击扩展图标即可将其打开或关闭。

如果您是像我一样的键盘快捷键爱好者，只需按“Alt+Shift+C”键即可切换扩展名。


----------

＃ 怎么运行的？

此扩展适用于 CSS 大纲属性：

在网页的任何 CSS 中添加以下代码片段


`
* {
轮廓：1px纯红色；
}`

扩展做同样的事情，唯一的就是；它为不同的元素赋予不同的颜色，而代码片段为每个元素添加了红色轮廓。

----------

# 其他工作和存储库

[jQuery 的轻量级可定制插件，以垂直进度条的形式显示水平长度。](https://github.com/pranayjoshicse/VerLim.js)


[在 jqueryscript.net 上列出](https://www.jqueryscript.net/other/Simple-Custom-Reading-Indicator-with-jQuery-VerLim-js.html)

[演示](https://www.jqueryscript.net/demo/Simple-Custom-Reading-Indicator-with-jQuery-VerLim-js/)


----------

＃ 更多关于我

[推特。](https://twitter.com/pranayjoshicse)
[关于我。](https://about.me/pranayjoshi)