CSS。 :hover 不在導航 > li 上工作

Question

我堅持了幾個小時，無法弄清楚為什么它在懸停時沒有做任何事情。 這僅發生在 li 元素上。

這是我的代碼（導航欄）： https : //jsfiddle.net/5tobthjx/2/我的 css 代碼從最底部（//My-css）開始。

如你所見，我有：

li:hover {
    border: 2px-solid-black;
}

為什么它什么都不做？

我什至在 lis 上放了一個類：'.li'

我的意思是：

   .li:hover {
        border: 2px-solid-black;
    }

Answer 1

你的語法錯誤。 你有這個：

li:hover {
    border: 2px-solid-black;
}

你要這個：

li:hover {
    border: 2px solid black;
}

這個對我有用

Answer 2

li:hover {
    border: 2px-solid-black;
}

這不是不使用的方式-只是給一個空間

li:hover {
    border: 2px solid black;
}

示例https://jsfiddle.net/5tobthjx/7/

Answer 3

您應該刪除分數：

li:hover{
    border:2px solid black;
}

這是正確的語法

Answer 4

對於特定的 li in nav ul li

nav ul li:hover {
    border: 2px solid black;
}