Ein CSS-Stylesheet über verschachtelte Klassen auf nur ein DIV beschränken

Question

Ich versuche, den Inhalt einer Website (Vorschau) in einer Admin-Oberfläche anzuzeigen. Dazu muss das gesamte CSS-Stylesheet für den Inhalt (die Website) auf das .preview-DIV in der Verwaltungsoberfläche angewendet werden. Die Datei website.css ist nicht immer die gleiche, da es darauf ankommt, welche Website in der Vorschau angezeigt wird.

Ich versuche, LESS.JS und verschachtelte Regeln zu verwenden, aber es funktioniert nicht mit Inline-Stilen. Ich bin auf einer Windows-Plattform.

<style> 
.preview { 
    <- Dynamically loading Website.css file content here -> 
} 
</style> 

Problem ist, dass LESS.JS nicht auf Inline-Styles handeln wird. Ich möchte die Datei website.css intakt halten.

Ich könnte die website.css laden, fügen Sie die zusätzliche Klasse, benennen Sie es in .less und schreiben Sie es zurück in den Ordner, und verknüpfen Sie die .less-Datei ... aber es scheint ein bisschen zu viel für etwas so einfach ...

Answer 1

Danke, endete mit LESS.JS, die ziemlich gut für diese Aufgabe geeignet ist. Ich habe die Website.css-Datei in eine .class des Container-DIV eingepackt.

Less.JS kompiliert das CSS und fügt die .class vor allen Definitionen hinzu, was den Trick macht. - mfr gerade bearbeiten jetzt

@*LESS.JS CSS*@ 
<style type="text/less" > 
    .preview 
    { 
     @File.ReadAllText(Server.MapPath(DesignHelper.GetTemplateFileName("Website.css"))) 
    } 
</style> 

Beachten Sie die 'weniger' in <style type="text/less" >