HTML标题属性使css:悬停不起作用

Question

我有一些代码来制作一个箭头，我正在尝试为它添加一个title属性

#arrow-right {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid white;
}
#arrow-right:hover {
border-left: 10px solid gray;
}

<div id="arrow-right" title="text here"></div>

在我添加"title"属性之前，它运行良好，悬停时将颜色更改为灰色，但在我添加了"title"特性之后，css颜色更改停止工作，但标题开始工作。有没有办法同时进行这两项工作？

Answer 1

替换

<div id="arrow-right" ; title="text here"></div>

带有

<div id="arrow-right" title="text here"></div>

Answer 2

我发现了问题。我有一些js在元素中声明样式，比如：

<div id="arrow-right" title="text here" style="border-right: 10px solid white;"></div>

除了样式表中声明的样式，这就破坏了它