从id或class定义悬停样式

Question

如果我有类似

的东西

<a id="link-id">...</a>

或

<a class="link-class">...</a>

如何使用link-id或link-class设置悬停行为？我已尝试过link-id：hover和link-class：悬停但不起作用。

Answer 1

使用像这样的hover伪类：

#link-id{
    height:300px;
    width:300px;
    font-size:20px;
    background:red;
    display:block;
    transition:0.5s ease;
}

#link-id:hover{    /*or .link-class if targeting by class*/
    font-size:30px;
    background:blue;
    cursor:poitner;
    text-align:center;
}

Demo

Answer 2

确保在元素的id之前写＃，并且。在课前名称。 例如：

.link-class:hover {}

#link-id:hover {}