2016-06-28 6 views
0

Mit Gravity Forms in WordPress haben Sie nicht viel Kontrolle über die Feldnamen, die es generiert. Wenn Sie also Felder ausrichten möchten 131, 132 und 133 in den Formen 11 und 15 ist hier, was die CSS aussieht (dies ist für einige CSS in einer Liste etwas mit dem letzten li Element zu tun):Können diese ausführlichen CSS-Selektoren mit SASS verbessert werden?

ul#input_11_131 li:last-child input, 
ul#input_11_132 li:last-child input, 
ul#input_15_131 li:last-child input, 
ul#input_15_132 li:last-child input { 
    //do something; 
} 

ul#input_11_133 li:last-child label, 
ul#input_15_133 li:last-child label { 
    //do a different thing; 
} 

Diese ist eine etwas vereinfachte Version, wir haben tatsächlich Dutzende mehr Zeilen wie folgt.

Derzeit verwenden wir nur SASS für einige einfache Dinge wie Verschachtelung und Variablen.

Aber ich frage mich, ob SASS dabei helfen kann. Idealerweise würden wir zu Beginn die Formnummern 11 und 15 am Anfang und vielleicht sogar die Felder definieren und durchlaufen.

+0

@danjonescidtrix Dinge, die Off-Topic für Code Review sind: Pseudo-Code, Beispiel-Code, Stub-Code, Beispiel-Code . – Kaz

Antwort

-1

Sie können auch css mit HTML Attributes anwenden.

LIKE

ul[id^='input_11_'] li:last-child input{  
    // Code common properties Here which is common in all input_11_* with li:last-child input 
} 

Für Details überprüfen Sie die w3school Referenz CSS SELECTORS

+0

das ist interessant, aber ich bin mir nicht sicher, dass es uns hilft, da wir nicht alle input_11_ * zielen wollen. deshalb rate ich nur sauer kann für uns liefern. aber ich muss meinen Vorschlag für andere Projekte bedenken – hawbsl

+0

Wenn Sie nicht möchten, dass es auf 1 oder 2 Selektoren von vielen angewendet wird, dann gibt es ': not()' selector auch in css. Oder Sie überschreiben einfach die CSS unter diesem Code. –

Verwandte Themen