什么是-webkit-focus-ring-color? [英] What is -webkit-focus-ring-color?

查看:181
本文介绍了什么是-webkit-focus-ring-color?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想为webkit到非webkit浏览器的重点输入框重现大纲效果。我在这里找到了使用的默认CSS webkit。感兴趣的行是:

I want to reproduce the outline effect for focused input boxes in webkit to non-webkit browsers. I found here the default CSS used in webkit. The lines of interest are:

:focus {
    outline: auto 5px -webkit-focus-ring-color
}

我试图在整个代码中搜索定义 -webkit-focus-ring-color 这里,但是找不到任何地方。

I tried making a search in the whole code for the definition -webkit-focus-ring-color here but could not find it anywhere.

推荐答案

<$在每个 RenderTheme 中, focusRingColor 在WebKit代码库中定义了 -webkit-focus-ring 类。该工作于2009年6月执行,作为 Jeremy Moskovich 的此更改集的一部分。

-webkit-focus-ring-color is defined in the WebKit codebase as focusRingColor in each RenderTheme class. That work was performed in June 2009 as part of this changeset by Jeremy Moskovich.

例如,默认的Mac主题(由Safari使用)定义 RenderThemeMac.mm (以迂回的方式)为:

For instance, the default Mac theme (used by Safari) defines the colour in RenderThemeMac.mm (in a roundabout way) as:

[NSColor keyboardFocusIndicatorColor]

该物业的非常轻的文档可在线获取)。

Mac(称为 WebCore :: oldAquaFocusRingColor )的覆盖值为用于测试(接近我可以告诉它的代码能够执行浏览器渲染和参考图形之间的比较;它使用 WebCore :: usesTestModeFocusRingColor )切换。它在 ColorMac.mm 中定义, code> (显然映射到 Color(125,173,217)):

There is an override value for the Mac (called WebCore::oldAquaFocusRingColor) to be used for testing (near as I can tell it's for the code to be able to perform comparison between the browser rendering and a reference graphic; it is toggled using WebCore::usesTestModeFocusRingColor). It's defined in ColorMac.mm as the following (which apparently maps to Color(125, 173, 217)):

0xFF7DADD9

Chromium / Chrome定义颜色在 RenderThemeChromiumSkia.cpp as:

Chromium/Chrome defines the colour in RenderThemeChromiumSkia.cpp as:

Color(229, 151, 0, 255)

默认颜色(在 RenderTheme.h )是纯黑色:

The default colour (specified in RenderTheme.h) is pure black:

Color(0, 0, 0)

这篇关于什么是-webkit-focus-ring-color?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆