首页 > 解决方案 > 我只需要在我的 div 中更改锚标记的样式,并为其他 div 使用不同的样式

问题描述

我想使用 css 在 div 中更改我的锚标记的样式,但代码将选择 html 代码中的所有锚标记

.links a:link,
{
  background-color: #ffbe58;
  color: white;
  padding: 5px 21px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 25px
}


}
.links a:visited {
  background-color: #ffbe58;
  color: white;
  padding: 5px 21px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 25px
}
.links a:hover {
  background-color: #4ca494;
  border-radius: 25px
}
.links a:active {
  background-color: #4ca494;
  border-radius: 25px
}

应该更改仅<a>包含在标签中的标签的样式<div>

编辑:这是其中的 HTML 部分


                                    <b>
                                        <a href="Tech.html" style="display:inline-block"> Tech </a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    
                                        <a href="Gaming.html" style="display:inline-block" > Gaming </a>  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        <a href="Sports.html" style="display:inline-block"> Sports</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        <a href="Stocks.html" style="display:inline-block"> Stocks </a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        <a href="Feedback.html" style="display:inline-block"> Feedback </a>

                                    </b>
                                </div>

标签: htmlcss

解决方案


为您的锚标签提供类名称:

<div class="links">
  <a class="myclassname" href="#">Link</a>
  <a href="#">Link</a>
  <a href="#">Link</a>
  <a href="#">Link</a>
</div>

在 CSS 中,选择您的链接并更改样式:

.links a.myclassname{
background: #ffbe58;
}

推荐阅读