如何使用css使用::after伪元素来修改网站页面中的元素

Question

请问如何使用 ::after 来装饰网站中的元素？ 我正在使用 stylebot 扩展或任何 css 修饰符扩展将 css 注入网站。

例如，Instagram Messenger 聊天框：

div.x14ctfv.x1okitfd.x6ikm8r.x10wlt62.x1mzt3pk.x1y1aw1k.xn6708d.xwib8y2.x1ye3gou.x1n2onr6.x13faqbe.x1vjfegm {

}

在这种情况下我该如何使用::after？

我试过了

div.x14ctfv.x1okitfd.x6ikm8r.x10wlt62.x1mzt3pk.x1y1aw1k.xn6708d.xwib8y2.x1ye3gou.x1n2onr6.x13faqbe.x1vjfegm::after {
}

但是没有成功。

Answer 1

每当您在 CSS 中使用

::before

或

::after

伪元素时，包含

content

属性至关重要，即使它设置为空字符串

''

也是如此。这是因为这些伪元素必须具有

content

属性才能在文档树中生成内容。

div.x14ctfv.x1okitfd.x6ikm8r.x10wlt62.x1mzt3pk.x1y1aw1k.xn6708d.xwib8y2.x1ye3gou.x1n2onr6.x13faqbe.x1vjfegm::after {
        content: '';

        /* other properties go here */
}