Spectre.css - Lichtgewicht op Flexbox gebaseerd Responsive CSS-framework

Als je erin wilt duiken flexbox-lay-outs dan is dit het beste moment om te beginnen. Moderne browsers zijn eindelijk het accepteren van flexbox-eigenschappen en meer ontwikkelaars doen mee aan de actie.

Maar waarom zou u helemaal opnieuw beginnen wanneer u kunt bouwen bovenop herbruikbare code? Spectre.css is een van de beste frameworks om te gebruiken als je nieuw bent bij flexbox.

Dit gratis open-source framework is vooraf gebouwd met een functionerend rastersysteem en gemeenschappelijke flexbox-eigenschappen. Het vertrouwt op Gulp voor het compileren en uitvoeren van CSS on the fly, vanaf elke computer.

Het ook maakt gebruik van LESS in plaats van Sass, wat Spectre en een geweldige keuze voor alle MINDER gebruikers kan maken.

Eén download van npm wordt geleverd met alles wat je nodig hebt: CSS-pictogrammen, mixins, variabelen, en vrijwel alles wat je zou verwachten van een typisch CSS-framework.

Alle code is volledig semantisch en ondersteunt alle HTML-tekstelementen, zelfs de nieuwere zoals . Tekststijlen ook ondersteuning voor Oost-Aziatische lettertypen met talen zoals Chinees, Japans en Koreaans.

Je kunt vinden veel voorbeelden op de “Elements” pagina welke geeft ontwerpsamples weer voor tekst, knoppen, tabellen, pictogrammen en webformulieren (onder andere).

Spectre komt ook met tonnen componenten dat kan u uren tijd besparen bij het programmeren vanaf nul. Dynamische functies, zoals pop-overs en vervolgkeuzemenu's, zijn super eenvoudig toe te voegen aan elke lay-out, met slechts een paar regels code.

Dit kader is nog steeds vrij nieuw en het ondergaat altijd veranderingen. Op het moment van schrijven is Spectre binnen v0.2 en heeft veel experimentele functies je kan het proberen.

Maar de primaire componenten, pagina-elementen en rasters zijn dat wel volledig functioneel en klaar voor een live productiesite. Spectre is een van de beste CSS-frameworks die op Less worden uitgevoerd met flexbox-rasters.

Ga naar de website voor meer informatie en aan de slag documentatiepagina over installatie en installatie.

U kunt ook een kopie van de code downloaden recht uit GitHub die ook een klein gedeelte voor documentatie heeft. En als je je gedachten wilt delen, kun je het officiële account @spectrecss tweeten.