Sortierung nach CSS-Spezifität

Mein Hauptziel ist es, einen CSS-Stilblock anhand seiner Spezifität neu anzuordnen. Ich hatte vorher von geholfenSO und ich habe es geschafft, diese Funktion zu produzieren.Siehe das Wesentliche.

Hier ist ein Beispiel:

function specificity($selector){
// https://gist.github.com/2774085
}

$compare = function($a, $b) use ($specificity) {
    return $specificity($a) - $specificity($b)
};

$array = css_array();

uksort($array, $compare);

Das oben Genannte hat funktioniert, bis ich auf dieses CSS gestoßen bin:

html, body, body div{
    background: transparent;
}
body {
    background-color: #D96F02;
}

Dies wird folgendermaßen neu angeordnet:

body { // 1 point
    background-color: #D96F02;
}
html, body, body div{ // 4 points
    background: transparent;
}

Auf diese Weise wendet der Browser das CSS jedoch nicht an.

Ich denke, dass meiner Spezifitätsfunktion die Bedeutung der Reihenfolge von CSS fehlt, anstatt basierend auf der Selektor-Spezifität zu ordnen. Ist das wahr?

Aktualisieren

Ich denke, was ich tun sollte, ist in meiner Vergleichsfunktion, ich sollte immer einen zusätzlichen Punkt hinzufügen10 weil die Spezifität nicht nur auf Selektoren basiert, sondern auch auf der Reihenfolge der Selektoren. So etwas in der Art:

 $compare = function($a, $b) use ($specificity) {
        return ($specificity($a) + 10) - $specificity($b)
    };

Wie sieht das aus und wie bestimme ich die Anzahl der Punkte, die ich in diesem Fall geben soll?

Antworten auf die Frage(1)

Ihre Antwort auf die Frage