css - 在文本后添加内容

标签 css pseudo-element

是否可以通过伪选择器::after 或::before 添加文本到特定单词?
例如。我想始终在“下载”一词旁边添加 pdf 图标。
[PDF] 下载

或者也许是另一种方法?

最佳答案

您在 pdf 上的链接需要包含 pdf,然后您可以使用此选择器:

a[href*="pdf"]:before {content: '[ICON] '}
a[href*="pdf"]:after {content: ' 😅';}
<a href="http://example.com/test.pdf" class="pdf">learn html and css in one week</a>

关于css - 在文本后添加内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44408817/

相关文章:

html - 具有倾斜底 Angular 的纯 CSS 功能区

jquery - 修复了由页脚向上推的侧边栏

html - 将 Google 字体与 Shadow DOM 结合使用

css 伪代码与之前的一个一起重新创建特色模型

html - CSS 伪元素 :before & :after work differently in Internet Explorer

css - 在 IE 中对 CSS 伪元素使用 "attr()"

javascript - 我已经检索了动态表的高度,现在我需要将该高度放入另一个元素中

javascript - `queue` 回调只执行一次?

html - CSS 重复规则最佳实践

html - 我怎样才能创建这个 Angular 阴影(没有图像)?