CleanCSS is 'n eenvoudige pythonic taal vir CSS geïnspireer deur CleverCSS maar eenvoudiger en minder obstruktiewe funksies.
Hoekom
Ek het regtig gehoop die idee agter CleverCSS maar wanneer dit gebruik word in die produksie het ek besef dat ek besig was om weg van sy parser te kry deur die ontsnapping snare en nie ondersteun CSS eienskappe manier te dikwels. Met behulp van die verkoper voorvoegsels soos -webkit-helling en waardes soos RGBA gelei tot 'n morsige CSS, so ek besluit om my eie parser vir 'n soortgelyke sintaksis skryf sonder al die komplekse funksies wat ek in elk geval nie gebruik het nie en dit werk nou goed vir my in REAL moderne webtuistes.
Syntax voorbeelde
Ek gaan die CleverCSS voorbeelde waar moontlik, aangesien die sintaksis is regtig soortgelyke hou.
'N klein voorbeeld hieronder. Let op die inkeping gebaseer sintaksis en hoe jy kan reëls nes:
#header, #footer:
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; marge: 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; familie: Verdana, sans-serif
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; grootte: .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; marge: 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: reg
kleur #ddd
Natuurlik kan jy die einste in CSS doen nie, maar as gevolg van sy plat aard van die kode sal meer verbose kyk. Die volgende stukkie van die kode is die CleanCSS uitset van die bogenoemde lêer:
#header, #footer {
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; marge: 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; marge: 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: reg;
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; kleur: # dddddd;
}
Biblioteekgebruik
Voer die cleancss module en noem die bekeerling () funksie met 'n lêer-agtige voorwerp.
Voorbeeld:
invoer cleancss
met oop ('file.css') as f:
& Nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Druk cleancss.convert (f)
Command line gebruik
Bel die cleancss.py sonder parameters om die gebruik instruksies wys. Slaag enige aantal lêers te cleancss.py en die script sal die lêers te CSS en druk die resultaat om die konsole.
Voorbeeld:
cleancss.py file.css> result.css
Vereistes :
- Python
Kommentaar nie gevind