Hemsida » Toolkit » 10 Lätta Alternativ Till Bootstrap & Foundation

    10 Lätta Alternativ Till Bootstrap & Foundation

    Att välja rätt ram som passar perfekt för dina projekt kan vara lite överväldigande - det finns mycket att välja mellan. Kanske vill du gå med populära val som Bootstrap eller Foundation, men om din webbplats kommer att bli en ganska enkel, du kommer inte behöva de flesta byggstenar och material ingår i standardpaketet.

    Den goda nyheten är att det finns en handfull alternativ som är mycket slankare än Bootstrap eller Foundation. De flesta av dessa ramar skickar med Bara rätt mängd stilar och komponenter för att hjälpa dig att komma igång, samtidigt som du kan förlänga dem i den riktning du vill ha för ditt projekt.

    Här är 10 lätta alternativ till Bootstrap och Foundation som du ska använda för bygga mindre skala webbplatser.

    Mer på Hongkiat.com:

    • Komma igång med Twitter Bootstrap
    • Använda Bootstrap 3 med Sass
    • Bootstrap Tool: Bygg HTML Bootstrap Layouts
    • Arbeta med Bootstrap Plugin: Modal Window
    • Bootstrap Tool: Bygg Megamenu med YAMM3

    1. Skelett

    Skelett har äntligen fått en ansiktslyftning. Det är en total revolvering från grunden, och ändå är det fortfarande så lätt som det brukade vara. Det nya Skeleton-nätverket antar nu mobila första filosofi, vilket säkerställer att layouten tar sig i centrum, oavsett hur liten skärmen är.

    Alla komponenter som inkluderades i den tidigare versionen - knappar, formulär och inmatningselement - finns fortfarande kvar, men grundläggande typografi stilar är nu inställda rem enhet.

    2. CardinalCSS

    CardinalCSS är en CSS-ram byggd med fokus på prestanda, läsbarhet och viktigast underhållbarhet. CardinalCSS antar några moderna tillvägagångssätt som mobil-först för att forma upp nätet. och CSS Box Model som gör att du enkelt kan bestämma elementets bredd och längd.

    CardinalCSS kommer också med en handfull helperklasser som gör att du snabbt kan använda stilar på ett element, till exempel drop-cap vilken tillämpar drop-cap-effekten för det första tecknet i stycket.

    3. ConciseCSS

    ConciseCSS är en CSS-ram - utan uppblåsthet. Det är en mager ram byggd ovanpå Sass, LESS, och Stylus, som banar sin gyllene väg till CSS underhållbarhet. Men om du föredrar vanlig enkel vanilj CSS, kan du få det också.

    På samma sätt kommer ConciseCSS också med basstilar för väsentliga delar som rubrikerna, styckena, tabellerna, formulären och en uppsättning av helpers-klass för att skapa knappen UI.

    4. PowertoCSS

    PowertoCSS är lätt och en solid frontendram. Klassnamn som används för att bygga nätet och tillämpa stilar är enkla och enkla att komma ihåg, t ex. .knapp. Du kan också lägga till ditt eget tema. Gå över till StarterKit för att komma igång.

    5. Furtive

    Furtive är ett mobilt första CSS-ramverk byggt kring banbrytande webbstandarder som användningen av Flexbox för nätet och rem Enhet för limning av element (inklusive typsnittstorlek). Furtive behåller ett litet CSS-fotavtryck genom att inte stödja äldre webbläsare (* hosta * Internet Explorer) eftersom de behöver lite CSS-hacking. Därför är Furtive en perfekt ram om du utformar en webbplats för framtiden.

    6. BassCSS

    BassCSS erbjuder en lätt uppsättning av grundläggande elementstilar, verktyg, layout och färgstilar, i modulär form för att bygga upp en responsiv webbapplikation. SCSS-filerna ingår för att enkelt anpassa stilen. Du kan spela med typografi, vitt utrymme, brytpunkter och UI-element.

    7. Mueller

    Mueller är ett modulärt lyhörd system byggt på toppen av Sass och Compass. Med Mueller kan du bygga rutnätet antingen genom att lägga till klasser direkt till HTML-elementen, eller om du föredrar att dina HTML-element ska vara snygga och rena, med hjälp av rutnät() fungera. Mueller-nätet kan användas i kombination med Masonry Javascript-biblioteket för att skapa en Pinterest-liknande layout.

    8. Tuktuk

    Tuktuk är ett mycket unikt namn för en ram. Jämfört med Bootstrap eller Foundation är Tuktuk mycket lättare eftersom det bara kommer med rätt mängd komponenter för att bygga en presentabel webbplats, inklusive för nätverket, grundläggande styling för typografi, tabeller och ett par användargränssnitt som navbar och modals.

    9. Bas

    Basen är byggd ovanpå LESS och Sass, och den innehåller bara de viktigaste komponenterna för att bygga webbplatser: rutnätet och den grundläggande utformningen av HTML-element. Base kommer inte med Javascript-komponenter, men det ger stor webbläsarkompatibilitet så mycket att det fungerar även med IE7.

    10. Toast

    Den sista av vår lista är Toast. Genom SCSS-stilarket ingår i paketet, kan Toast enkelt konfigurera raster klassnamn, rännan och även kolumnbasen. Om du till exempel vill att nätet ska vara en kolumn med 9 baser istället för 12 kan du göra det. Toast är ett minimalt CSS-ramverk med mycket flexibla konfigurationer som tillgodoser dina krav.