Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.5k views
in Technique[技术] by (71.8m points)

鼠标在 input 框内点击时边框有一种闪烁的效果,它的哪个默认属性导致了它这种效果呢?

鼠标在 input 框内点击时边框有一种闪烁的效果, 可能是鼠标点击时改变了边框的颜色造成的视觉效果。 是哪个 input 默认属性导致的这种效果呢?
https://jsbin.com/muwotixohu/edit?html,css,output

input.png


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

观察到是user agent stylesheet的input中的background-color和border-color造成的效果。

input {
    background-color: -internal-light-dark(rgb(255, 255, 255), rgb(59, 59, 59));
    border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133));
}

以下两个样式添加其中任一个,那个点击时的变化就没了。

element.style {
  background-color: #fff;
  border-color: #ccc;
}

可能跟这个-internal-light-dark有关,但是为啥搜不到相关资料?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

2.1m questions

2.1m answers

60 comments

57.0k users

...