如何在HTML链接标记中添加：：after
如何在HTML链接标记中添加：：after,html,css,pseudo-element,Html,Css,Pseudo Element,元素之后的：：有一个CSS效果。例如： .wrapper a:hover:after, footer.main-footer a:hover:after { background:#ff0000; } 在Chrome开发者控制台中，我注意到有一个链接标签，里面有：：在之后，会显示效果 <a href="test.com" data-term="event">Event::after</a> 而有些人却没有 <a class="back-to-portf
元素之后的：：有一个CSS效果。例如：
.wrapper a:hover:after, footer.main-footer a:hover:after {
background:#ff0000;
}
在Chrome开发者控制台中，我注意到有一个链接标签，里面有：：在之后，会显示效果
<a href="test.com" data-term="event">Event::after</a>
而有些人却没有
<a class="back-to-portfolio" href="test2.com">All</a>
该元素不显示效果。问题是，如何将：：after
添加到链接标记，或者在什么条件下：：after
将显示？添加内容
属性如下：
.wrapper a:hover:after, footer.main-footer a:hover:after {
width: 30px;
height: 30px;
background:#ff0000;
content: "";
display: inline-block;
}
基本上对于：在元素工作或出现后，应匹配整个选择器。在下面的代码片段中，您可以看到只有a
元素是.wrapper
元素或footer.main footer
元素的后代，它是如何获得：after
元素的。另一个a
位于div.wrapper
和footer.main footer
之外，它不获取：after
元素
另一件需要注意的事情是。因此，在下面的代码片段中，：after
元素仅在a
悬停时生成
.wrapper a:hover:after，
footer.main-footer a:悬停：之后{
背景：#ff0000；
}
/*只是为了演示*/
.wrapper，
页脚{
位置：相对位置；
高度：40px；
}
.a:悬停：之后，
footer.main-footer a:悬停：之后{
位置：绝对位置；
内容：“”；/*这很重要*/
身高：100%；
宽度：100%；
左：0px；
顶部：0px；
z指数：-1；
}
太好了。非常详细，这意味着我需要为那些没有：：after的链接创建一个类，并为该类设置内容：“”？是的，或者给它们的父类提供包装器类：）