想立即获取页面中某个元素的颜色？其实不需要任何第三方工具或 Chrome 扩展，Chrome 自带的 Eye Dropper 就够了。Web 开发者使用 Chrome 元素审查(Elements Inspect)的时候会看到该元素所应用的 CSS 样式，其中表示 CSS 颜色样式的旁边有一个小方块，点击这个小方块就会弹出颜色提取器 Eye Dropper 。

在弹出 Eye Dropper 的时候，你不仅仅可以直接用它设置颜色，你还可以把鼠标移到网页中，这时 Eye Dropper 就会实时显示当前元素的颜色，点击则立即将当前元素颜色应用到该 CSS 的颜色设置中，如果不合适可以按 ESC 取消。

顺便说一下，按住 Shift 的同时用鼠标点击这个小方块可以在各种 CSS 颜色单位之间前后，如 RGB 和 HSL 。

作者：韩国恺。本系列文章以 Addy & Matt 的系列视频  Totally Tooling Tips 的内容为基础重新整理而成，主要介绍一些(前端)开发者喜欢的工具和技巧。

Post Views: 1

除非特别声明，此文章内容采用 知识共享署名 3.0 许可，代码示例采用 Apache 2.0 许可。更多细节请查看我们的 服务条款 。