CleanCSS

CleanCSS is een eenvoudige pythonic taal voor CSS geïnspireerd door CleverCSS maar eenvoudiger en met minder belemmerende functies.
Waarom
Ik vond het idee achter CleverCSS maar wanneer gebruikt in de productie realiseerde ik me dat ik probeerde om uit de buurt van haar parser krijgen door het ontsnappen strijkers en ondersteunde CSS-eigenschappen veel te vaak. Met behulp van vendor voorvoegsels als -webkit-gradiënt en waarden zoals RGBA resulteerde in een rommelige CSS, dus heb ik besloten om mijn eigen parser voor een soortgelijke syntax schrijven zonder alle complexe functies die ik toch niet heb gebruikt en het werkt nu prima voor mij in REAL moderne websites.
Syntax voorbeelden
Ik ga naar de CleverCSS voorbeelden waar mogelijk, omdat de syntax is echt vergelijkbaar te houden.
Een klein voorbeeld hieronder. Let op de inkeping op basis syntax en hoe u regels nest:
#header, #footer:
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; margin: 0
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; padding: 0
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; font->
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; family: Verdana, sans-serif
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; size: .9em
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; li:
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; padding: 0.4em
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; margin: 0.8em 0 0.8em
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; h3:
                        font-size: 1.2em
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; p:
                        padding: 0.3em
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; p.meta:
                        text-align: rechts
                        kleur: #ddd
Natuurlijk kunt u precies hetzelfde in CSS te doen, maar vanwege het vlakke karakter van de code zou uitgebreidere kijken. Het volgende stukje code is de CleanCSS output van het bovenstaande bestand:
#header, #footer {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; margin: 0;
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; padding: 0;
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; font-family: Verdana, sans-serif
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; font-size: .9em
}
#header li,
#footer li {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; padding: 0.4em;
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; margin: 0.8em 0 0.8em;
}
#header li h3,
#footer li h3 {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; font-size: 1.2em;
}
#header li p,
#footer li p {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; padding: 0.3em;
}
#header li p.meta,
#footer li p.meta {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; text-align: right;
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; kleur: #dddddd;
}
gebruik Bibliotheek
Importeer de cleancss module en bel de bekeerling () functie met een bestand-achtig object.
Voorbeeld:
import cleancss
met open ('file.css') als f:
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; afdruk cleancss.convert (f)
Command line gebruik
Bel de cleancss.py zonder parameters om de gebruiksinstructies tonen. Passeren een aantal bestanden naar cleancss.py en het script zal de bestanden te converteren naar CSS en print het resultaat aan de console.
Voorbeeld:
cleancss.py file.css> result.css

Eisen

• Python