Kann ein Sass Selector ein '%' Zeichen enthalten?

Ich habe eine Variable, die einen String-Wert in Form von einigen Prozent enthält z. B.. '10% 'Ich möchte diesen Wert verwenden, um einen Klassennamen zu erstellen, der zu meinem HTML-Element hinzugefügt wird, wenn der Prozentsatz etwas über' 0% 'ist. Ich dachte, das wäre einfach mit einer Sass-Schleife, aber ich kann nicht scheinen, um den Klassennamen richtig zu konstruieren. Ich dachte, es würde ungefähr so aussehen.Kann ein Sass Selector ein '%' Zeichen enthalten?

@for $i from 1 through 100{ 
    .highlight-#{$i}% { 
     // styling 
    } 
    } 

    .highlight-0% { 
     // styling 
    }

Ich habe versucht, mehrere Varianten:

.highlight-#{$i + '%'} { // styling } 
.highlight-#{$i}${'%'} { // styling }

Ich weiß nicht, ob dies überhaupt möglich ist, da ‚%‘ reserviert werden können.

Ich füge die HTML-Datei nur für den Fall, dass jemand vorschlagen kann, um die% in dort zu entfernen. Das würde ich gerne tun können:

<tr><td class="pad-10 highlight-${publisher.numViewsPercentage}" align="center">${publisher.numViewsPercentage}</td></tr>

Quelle

2016-05-12 dspano

was '%' auf 'prct' zu ändern? – arcee123

Ich habe nur meinen String-Wert in der HTML-Seite und ich kann es nicht ändern, da es letztlich als Anzeigewert verwendet wird. Es wäre ideal, wenn dieser Wert eine Zahl wäre und der% im HTML-Code hinzugefügt wurde. Ich werde hinzufügen, wie mein Element aussieht, vielleicht gibt es einen Vorschlag, den Prozentsatz zu entfernen, in dem der Klassenname erstellt wird. – dspano

Wo ist publisher.numViewsPercentage? – arcee123

Nicht nur ist % ein reserviertes Zeichen in Sass, das größere Problem ist, dass es kein zulässiges Zeichen in CSS-Selektornamen ist. Selbst wenn Sie Sass kompilieren könnten, sind die resultierenden Klassennamen nicht gültig und funktionieren nicht.

In den meisten Fällen müssen Selektornamen nur Buchstaben, Zahlen, Unterstriche und Bindestriche enthalten.

.nopercent { 
 
    color: red; 
 
} 
 

 
.percent% { 
 
    color: red; 
 
}

<div class="nopercent"> 
 
    An element withOUT a percent sign in the class. 
 
</div> 
 
<div class="percent%"> 
 
    An element with a percent sign in the class. 
 
</div>

Quelle

2016-05-12 21:35:20

% ist ein Platzhalterzeichen in SASS seit Version 3.2. Sie sollten es nur für "unsichtbare" Extents verwenden.

Quelle

2016-05-12 21:10:32

Kann ein Sass Selector ein '%' Zeichen enthalten?

Antwort

Verwandte Themen