html - 我根本无法在悬停时更改我的 div

Question

我只是想将 div 颜色从浅蓝色更改为黑色。不幸的是我不能让它改变颜色或任何东西。我尝试了各种代码，但似乎都不起作用。这是我的代码。

**HTML**




    <a href="#">
    <div id="entertainment">
    <h1 style="font-size:25px;"> Entertainment </h1>
    </div>
    </a>

这是我的 CSS

    #entertainment{
     background-color:#6db1e1;
     width:160px;
     height:70px;
     margin-top:5px;
     margin-left:334px;
     position:absolute;
    }

     a,entertainment{

    color:black;
    text-decoration: none;
     }

a.entertainment:悬停{

margin-radius:20px;
background-color:green;

Answer 1

您的 a.entertainment:hover 不适用于您的 html 设置。您在该行中所说的是“我想定位一个具有类别且悬停的标签”

为了使代码与您的 html 结构一起工作，您必须从 css 选择器中删除 a 标签:

#entertainment:hover {
  /* hover style here */
}

#entertainment{
     background-color:#6db1e1;
     width:160px;
     height:70px;
     margin-top:5px;
     margin-left:334px;
     position:absolute;
}

a,entertainment{

    color:black;
    text-decoration: none;
}
     
#entertainment:hover{

    border-radius:20px;
    background-color:green;

}

    <a href="#">
    <div id="entertainment">
    <h1 style="font-size:25px;"> Entertainment </h1>
    </div>
    </a>