放置 HTML 伪元素答案

【问题标题】：Placing HTML Pseudo elements放置 HTML 伪元素
【发布时间】：2011-04-04 20:17:09
【问题描述】：

我的 CSS 看起来像这样；

p:not(.dummy):after
{
    content: url(../../irhiddenchars/img/afterimage_9x9.gif);
}

我希望拍摄更高（高度）的 gif，但是当应用 css 时我的 lineheigth 会增加（即使似乎有足够的空间容纳更大的图片，p-tag 的 line-height 是 18px）。是否可以将包含 gif 的伪元素以某种方式放置在页面上更高一点的位置？有没有其他解决办法？

【问题讨论】：

【解决方案1】：

使用 jQuery，不仅可以插入内容，还可以给它一个类并设置样式以准确定位到您想要的位置。

【讨论】：

【解决方案2】：

尝试将margin 和padding 设置为0。 p 元素（以及其他元素）具有由浏览器确定的隐式标准标记。

我仍然想知道为什么你使用:after 伪类而不是嵌套img。有什么具体原因吗？

编辑：哇，这个问题有两个月了，为什么会出现在最近的问题页面上？

【讨论】：

【解决方案3】：

我解决了它在接近后丢弃图像（我有一个显示 Pilcrow 符号的图像）。相反，我使用 Pilcrow 字符（根据选择的字体大小呈现）：

body.hiddenchars p:after
{
    content: '\00b6';
}

【讨论】：