个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
28
4
我注意到这个复选框在某些浏览器上选中时有时会显示蓝色突出显示。我不完全确定这是从哪里来的，因为我只能从我的 iPhone 上的 Safari 以及 Chrome 开发人员工具的设备模式中看到这种行为。但是，桌面版 Chrome 和 Firefox 根本不包含突出显示。
.center {
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
}
.switch {
width: 120px;
height: 68px;
position: relative;
display: inline-block;
}
.switch input {
visibility: hidden;
}
.slider {
top: 0;
left: 0;
right: 0;
bottom: 0;
cursor: pointer;
position: absolute;
transition: 0.375s;
border-radius: 68px;
background-color: #414b55;
}
.slider:before {
left: 8px;
bottom: 8px;
width: 52px;
height: 52px;
content: "";
position: absolute;
transition: 0.375s;
border-radius: 50%;
background-color: #ffffff;
}
input:checked + .slider {
background-color: #fa6400;
}
input:checked + .slider:before {
transform: translateX(52px);
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example</title>
</head>
<body>
<div class="center">
<label class="switch">
<input type="checkbox">
<span class="slider"></span>
</label>
</div>
</body>
</html>有人可以解释它的来源以及如何消除这种影响吗？
最佳答案
它可能是 tap-highlight-color，您可以使用以下代码使其透明:
.switch {
-webkit-tap-highlight-color: transparent
}
另见 https://stackoverflow.com/a/21003770/753676其中提到了这一点以及 user-select: none 和 -webkit-touch-callout: none 方法。
但对于移动版 Chrome，您仍然需要 -webkit-tap-highlight-color 设置。
关于html - 有没有办法删除复选框的蓝色突出显示？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/61308314/
28
4
0
有没有一种方法可以“标记”对象的属性，使它们在反射中“突出”？ 例如： class A { int aa, b; string s1, s2; public int AA
我是一名优秀的程序员,十分优秀！