Eyedropper - Firefox 开发者工具 编辑

取色器是Firefox31中新增的功能

你可以使用取色器提取当前页面上的颜色。当取色器被激活的时候,它就像一个“放大镜”,使得你可以进行像素精度的颜色选择。在取色器下方显示的是当前像素点的颜色值,颜色值显示格式与你在设置中选择的一致

使用取色器有两种方法:

  • 从页面上提取一种颜色,然后粘贴在剪贴板上
  • 把”检查器“样式视窗中的颜色改变为你在页面上选择的颜色

把一个颜色值复制到剪切板

有两种方法激活取色器

  • 选择”开发者工具“菜单下的”取色器“
  • 点击工具栏中的取色器按钮(但是要注意这个按钮默认是不显示的:你需要在”开发者工具箱“中勾选上”从页面上抓取一个颜色“来使它默认可见)

选中取色器之后,随着鼠标在页面上的移动,你可以看到取色器下面的当前颜色值也在变化。点击鼠标会把当前的颜色值复制到剪切板

(youtube视频演示需要翻墙,否则不能加载)

改变样式中的颜色值

检查器css样式中的颜色值旁边有一个圆形的颜色样板:点击颜色样板会出现一个颜色提取弹窗。从火狐31版本之后,弹窗包含一个取色器图标:点击这个图标可以激活取色器

现在,点击弹窗中取色器,然后移动鼠标点击页面,css样式中的颜色值就会变成你所选择的颜色


(youtube视频演示需要翻墙,否则不能加载)

键盘快捷键

CommandWindowsmacOSLinux
Select the current colorEnterReturnEnter
Dismiss the EyedropperEscEscEsc
Move by 1 pixelArrow keysArrow keysArrow keys
Move by 10 pixelsShift + arrow keysShift + arrow keysShift + arrow keys

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

词条统计

浏览:136 次

字数:3365

最后编辑:7年前

编辑次数:0 次

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文