html - 我只需要在我的 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>
<a href="Gaming.html" style="display:inline-block" > Gaming </a>
<a href="Sports.html" style="display:inline-block"> Sports</a>
<a href="Stocks.html" style="display:inline-block"> Stocks </a>
<a href="Feedback.html" style="display:inline-block"> Feedback </a>
</b>
</div>
解决方案
为您的锚标签提供类名称:
<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;
}
推荐阅读
- angular - 数据上传表单excel表时分页不起作用
- python - 无法使用 sshtunnel SSH 到 Google Cloud Compute Engine
- testing - 在 mac 本地运行 Chaos Monkey
- html - Flutter - dart.ui 没有方法'platformViewRegistry'
- mysql - 未处理的异常:无效参数:DART 上的长度非法 0
- sql - SQL - Postgres 字符串 agg 给出重复项
- javascript - 过滤 JSON - Angular 8
- java - 对 LeetCode 上的“按顺序打印”问题感到困惑
- html - Bootstrap 导航栏项目没有进入中心
- excel - 将多个工作簿中的表合并到一个主工作簿中