[英]How to make the link text change color instead of underlining when hovered over
[英]How to remove underlining when a link is hovered over for certain links?
<div class = "shared_link_post_container">
<a id="{{post.status_id}}_shared_link_img" href="{{post.link}}" target="_blank">
<img src="{{post.picture}}">
</a>
<a id="{{post.status_id}}_shared_link_text" class="shared_link_text" href="{{post.link}}" target="_blank">
<div id="{{post.status_id}}_clickable_text_box" class="clickable_text_box">
<br>
<span class="shared_link_name">{{post.name}}</span>
<br>
<span class="unlinked shared_link_caption">{{post.caption}}</span>
<br>
<br>
<span class="unlinked shared_link_description">{{post.description}}</span>
</div>
</a>
</div>
我希望在链接悬停时, unlinked
链接类的链接不带有下划线。 我试过了:
.unlinked {
color: gray;
font-weight: normal;
text-decoration: none;
}
这似乎并不工作,主要是因为我的unlinked
类应该是a
类。 但是,我不想删除所有链接的下划线,只是要删除unlinked
链接的类。
将span
变成块级元素,然后执行以下操作:
.shared_link_name {
display: inline-block;
text-decoration: underline;
}
.shared_link_name:hover {
text-decoration: none;
}
使用以下代码:
.unlinked {
display: inline-block;
color: gray;
font-weight: normal;
text-decoration: underline;
}
/* For hover condition */
.unlinked:hover {
text-decoration: none;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.