2013-07-24 6 views
39

Ich weiß, dass vor gefragt worden ist, aber ich finde keinen sauberen Weg, um diese CSS vorran:Wie überschreibe ich CSS-Set für ein Pseudo-Element?

.ui-input-search:after { 
    content: ""; 
    height: 18px; 
    left: 0.3125em; 
    margin-top: -9px; 
    opacity: 0.5; 
    position: absolute; 
    top: 50%; 
    width: 18px; 
} 

I ui-input-search auf das Element verlassen müssen, kann aber meine eigene Klasse, wie hinzufügen:

.ui-input-search-no-pseudo:after { 
    content: ""; 
} 

Frage:
Gibt es eine einfache Möglichkeit, "Pseudo-CSS" zu entfernen, ohne das CSS Zeile für Zeile zu überschreiben?

Danke!

Antwort

78

Soweit ich sagen kann gibt es keinen anderen Weg, als alle Eigenschaften zu überschreiben. Die Stile werden für das Element definiert. Sie werden nicht einfach durch einen anderen Selektor, der auf das Element ausgerichtet ist, ausgeblendet.

Wenn Sie nur das Pseudo-Element von der Seite entfernen möchten, können Sie content: none tun.

+4

den 'Inhalt: none' war das, was ich brauchte. Perfekt! Danke. – frequent

+30

Der Unterschied zwischen 'content:" "' und 'content: none' ist, dass' content: "" 'ein Pseudo-Element ohne Inhalt (dh ein leeres Pseudo-Element) erzeugt, während' content: none' das Pseudo verhindert -Element überhaupt erzeugt werden. – BoltClock

+0

@ BoltClock's Kommentar sollte in der Antwort für die Erklärung enthalten sein. –

3

Hier wirkt sich content: ""; überhaupt nicht aus Wenn Sie dieses Pseudo entfernen möchten, müssen Sie content:none; verwenden, damit zuvor hinzugefügter Pseudoinhalt entfernt wird.

Wenn das nicht auch hilft versuchen:

display:none; 
//or 
display:none !important; 

hier arbeitet jsfiddle

https://jsfiddle.net/ganeshswami99/52duu0x8/1/

Verwandte Themen