使用链接和输入元素（chrome）加载时触发CSS转换

Question

我有同时使用链接和输入元素的麻烦，这很奇怪！

CSS转换是在加载时触发的，即使我使用悬停效果，并且只有在网站上存在输入元素时才会触发。这一切都适用于Chrome，尚未在其他浏览器中对此进行过测试。

以下是我的代码简化为手头的问题：

HTML：

<input type="text" placeholder="Test search" />
<a href="#">Test</a>

CSS：

a {
    background: #000;
    transition: background 3s ease;
}

a:hover {
    background: none;
}

链接到示例：https://embed.plnkr.co/ri5FknRdbPDY7T2lNldS/尝试并刷新实时预览几次以查看问题。 （这不适用于JSFiddle或Codepen，简单因为它们使用内部样式。为了重现这个问题，样式必须来自外部样式表，这就是我在Plunker上创建它的原因。）

如果我在头部的样式标签中内联css代码，则没有问题。如果我删除输入元素，也没有问题。它似乎只是链接元素的一个问题。

这里发生了什么？ :) - 谢谢！

Answer 1

这是一个Chrome错误，已有报道。

解决此问题的一种黑客方法是在网站的某处添加脚本标记。