Kendo UI: 移除单选按钮点击后发光
Kendo UI: Remove the Radio Button Glow After Clicked
我正在使用 Kendo UI (MVC) 创建一个单选按钮,在调整一些位置后它可以正常工作。但是,单击单选按钮后,单选按钮周围会发出恼人的光芒。只有当单选按钮仍然有焦点并且鼠标不再悬停在单选按钮上时它才可见。我查看了 Chrome 开发人员工具中的样式,但无法找到应用此样式的位置。一张图就是我说的:
选择"moonlight"主题(点击右上角"Change Theme")后,可以找到"live"我说的例子here。该示例当鼠标不再悬停在所选项目上时,所选单选按钮变为橙色。
我也看了chrome提供的四种元素状态(:active, :focus, :hover, :visited),其中none似乎有我的风格寻找(甚至没有表现出相同的行为。)
我对 Web 方面的事物仍然很陌生,所以我很可能遗漏了一些东西,我只是希望我知道那是什么。
根据您提供的演示页面,您要寻找的样式是这样的:
.k-radio:focus+.k-radio-label:before {
border-color: #f9b303;
-webkit-box-shadow: 0 0 3px 0 #f4af03;
box-shadow: 0 0 3px 0 #f4af03;
}
单选按钮的 :focus
上的样式应用于前一个 .k-radio-label
的 :before
puesdo 元素
只需针对此创建一个新样式并设置 box-shadow: none;
我正在使用 Kendo UI (MVC) 创建一个单选按钮,在调整一些位置后它可以正常工作。但是,单击单选按钮后,单选按钮周围会发出恼人的光芒。只有当单选按钮仍然有焦点并且鼠标不再悬停在单选按钮上时它才可见。我查看了 Chrome 开发人员工具中的样式,但无法找到应用此样式的位置。一张图就是我说的:
选择"moonlight"主题(点击右上角"Change Theme")后,可以找到"live"我说的例子here。该示例当鼠标不再悬停在所选项目上时,所选单选按钮变为橙色。
我也看了chrome提供的四种元素状态(:active, :focus, :hover, :visited),其中none似乎有我的风格寻找(甚至没有表现出相同的行为。)
我对 Web 方面的事物仍然很陌生,所以我很可能遗漏了一些东西,我只是希望我知道那是什么。
根据您提供的演示页面,您要寻找的样式是这样的:
.k-radio:focus+.k-radio-label:before {
border-color: #f9b303;
-webkit-box-shadow: 0 0 3px 0 #f4af03;
box-shadow: 0 0 3px 0 #f4af03;
}
单选按钮的 :focus
上的样式应用于前一个 .k-radio-label
:before
puesdo 元素
只需针对此创建一个新样式并设置 box-shadow: none;