Javascript CSS:如何删除伪元素(之后,之前,...)?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3012716/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS: How to remove pseudo elements (after, before,...)?
提问by Thariama
I would like to use a switch for the layout of paragraph tags on a webpage.
我想使用一个开关来布局网页上的段落标签。
I use the after pseudoelement:
我使用 after 伪元素:
p:after {content: url("../img/paragraph.gif");}
Now I need to remove this CSS code from the page.
现在我需要从页面中删除这个 CSS 代码。
How can this be done easily?
如何轻松做到这一点?
I want to add that:
我想补充一点:
jQuery is already used on the page
and I do not want to include or remove files containing CSS.
页面上已经使用了jQuery
我不想包含或删除包含 CSS 的文件。
回答by Gilly
p:after {
content: none;
}
noneis the official value to set the content, if specified, to nothing.
none是将内容(如果指定)设置为空的官方值。
回答by Gabriele Petrioli
You need to add a css rule that removes the after content (through a class)..
您需要添加一个 css 规则来删除 after 内容(通过一个类)..
An updatedue to some valid comments.
一个更新由于一些有效的意见。
The more correct way to completely remove/disable the :afterrule is to use
完全删除/禁用:after规则的更正确方法是使用
p.no-after:after{content:none;}
正如阿娇罗王回答的那样。
Original answer
原答案
You need to add a css rule that removes the after content (through a class)..
您需要添加一个 css 规则来删除 after 内容(通过一个类)..
p.no-after:after{content:"";}
p.no-after:after{content:"";}
and add that class to your pwhen you want to with this line
并p在您想要使用此行时将该类添加到您的
$('p').addClass('no-after'); // replace the p selector with what you need...
a working example at : http://www.jsfiddle.net/G2czw/
一个工作示例:http: //www.jsfiddle.net/G2czw/
回答by Henrik Albrechtsson
$('p:after').css('display','none');
回答by simhumileco
As mentioned in Gillian's answer, assigning noneto contentsolves the problem:
正如Gillian 的回答中提到的,分配none到content解决问题:
p::after {
content: none;
}
Note that in CSS3, W3Crecommended to use two colons (::) for pseudo-elementslike beforeor after.
请注意,在CSS3 中,W3C建议对before或after等伪元素使用两个冒号 ( ::) 。
From the MDN web doc on pseudo-elements
Note:As a rule, double colons (
::) should be used instead of a single colon (:). This distinguishes pseudo-classes from pseudo-elements. However, since this distinction was not present in older versions of the W3C spec, most browsers support both syntaxes for the sake of compatibility. Note that::selectionmust always start with double colons (::).
注意:通常,
::应使用双冒号 ( ) 而不是单个冒号 (:)。这将伪类与伪元素区分开来。然而,由于旧版本的 W3C 规范中不存在这种区别,大多数浏览器为了兼容性而支持这两种语法。请注意,::selection必须始终以双冒号 (::)开头。
回答by drewww
This depends on what's actually being added by the pseudoselectors. In your situation, setting content to ""will get rid of it, but if you're setting borders or backgrounds or whatever, you need to zero those out specifically. As far as I know, there's no one cure-all for removing everything about a before/after element regardless of what it is.
这取决于伪选择器实际添加的内容。在您的情况下,将内容设置为""将摆脱它,但如果您要设置边框或背景或其他任何内容,则需要专门将它们清零。据我所知,没有一种万能药可以删除有关 before/after 元素的所有内容,无论它是什么。
回答by SkyRideR
had a same problem few minutes ago and just content:none;did not do work but adding content:none !important;and display:none !important;worked for me
几分钟前遇到了同样的问题,只是content:none;没有工作,但添加content:none !important;并display:none !important;为我工作
回答by Priyanka Choudhary
p:after {
content: none;
}
This is a way to remove the :afterand you can do the same for :before
这是一种删除 的方法:after,您可以为:before

