De beste open source CSS-frameworks

Hoewel de meeste websites onder een contentmanager draaien, valt er veel te zeggen voor het creëren van een geheel nieuwe portal. En hoe dan ook, contentmanagers hebben ook iemand nodig die voor hun visuele uitstraling zorgt. In dit bericht we gaan enkele van de beste tools bespreken voor het maken van CSS-stylesheets.

Laten we bij het begin beginnen. Wat is CSS?

Hoe zou het huis van je dromen eruit zien? Zou het een of twee verdiepingen hebben? Wil je de slaapkamers beneden en de keuken boven? Waarom zet u de badkuip niet in de slaapkamer?

En als dat eenmaal is opgelost, welke kleur zou je de kamers dan schilderen? Zou je de voorkant van steen maken?

We kunnen een analogie maken tussen een website en een huis​ Enerzijds hebben we de structuur van de site en anderzijds het visuele aspect.  In het geval wordt de structuur bepaald met een plan en de visuele uitstraling door te kijken naar decoratiestalen.

CSS is de afkorting voor Cascading Style Sheets​ Terwijl HTML wordt gebruikt om een ​​webdocument te structureren (dingen definiëren zoals pagina's, koppen en aangeven wanneer afbeeldingen, video en andere media moeten worden ingesloten) CSS stelt de stijl, kleuren en typografie van de pagina in.

Met CSS u kunt de stijl voor elk HTML-element definiëren​ Elementen zijn de afzonderlijke HTML-componenten van een webpagina.

Stijlbladen ze kunnen extern, intern of online zijn​ Als u ze extern wilt gebruiken, moet u ze opslaan als .css-bestanden en het .html-bestand vertellen waar u ze kunt vinden.

In de interne modus worden instructies in de koptekst van een specifieke .html-pagina geschreven, waardoor het laden van de pagina langzamer en wijzigingen ingewikkelder worden.

Met de online modus wordt de externe stylesheet op een andere server gehost. Ze zijn vooral geschikt als we ze meerdere keren willen gebruiken.

Wat is een CSS-framework?

CSS-frameworks het zijn hulpmiddelen die door ontwikkelaars van gebruikersinterfaces worden gebruikt om hun werk sneller te maken. In plaats van elke keer dat er een nieuw project komt, nieuwe oplossingen te bedenken, lframeworks geven ontwikkelaars de tools om snel gebruikersinterfaces te maken die naar behoefte kunnen worden aangepast en herhaald.

In een paar woorden kunnen we kaders definiëren als een verzameling CSS-stijlpagina's die zijn voorbereid en klaar voor gebruik in verschillende soorten situaties.

Tijdsbesparing is niet het enige voordeel van het gebruik van CSS-frameworks. Door ze te gebruiken zijn de ontwerpen gestandaardiseerd en ze stellen een ontwikkelaar in staat om gemakkelijk de code van een andere ontwikkelaar te lezen.

De beste open source CSS-frameworks

Bootstrap

Volgens henzelfBootstrap is de meest populaire framework voor HTML, CSS en JS. Het is ideaal voor het ontwerpen van mobielvriendelijke (Mobile first) en responsieve sites.

Foundation

Het lijkt erop dat de mensen die kaders maken geen grootmoeder hebben.
Foundation Het wordt beschreven als '' s werelds meest geavanceerde adaptieve raamwerk '

Het is een handig hulpmiddel voor het maken van websites en webapplicaties met de nadruk op zakelijke behoeften. Facebook, eBay, Mozilla, Adobe, HP, Cisco en Disney behoren tot de gebruikers.

Bulma

Bulma is een gratis en open source CSS-framework gebaseerd op Flexbox en gebruikt door meer dan 200.000 ontwikkelaars.

Flexbox is ontworpen om de ruimte tussen items in een interface te verdelen en de uitlijningsmogelijkheden te verbeteren. Flexbox verwerkt de lay-out in slechts één dimensie tegelijk - als een rij of als een kolom. Dit in tegenstelling tot het tweedimensionale model van de CSS Grid Layout, dat kolommen en rijen tegelijk verwerkt.

Semantische gebruikersinterface

Semantische gebruikersinterface is een ontwikkelingsraamwerk dat helpt bij het creëren van mooie en responsieve lay-outs met behulp van mensvriendelijke HTML.

Dit raamwerk belooft ons in staat te stellen prachtige ontwerpen te bouwen met zijn meer dan 3000 thematische variabelen en meer dan 50 gebruikersinterfacecomponenten.

Het kan ook worden geïntegreerd met veel bibliotheken van derden, waaronder React, Angular, Meteor of Ember.