Voeg vooraf ontworpen knoppen toe aan uw site met Butns.css

Frontend-frameworks, zoals Bootstrap, hebben hun eigen knopstijlen, maar meestal hebben ze niet veel variatie .

De gratis Butns-bibliotheek biedt een hele reeks aangepaste knopstijlen zonder dat het hele kader is bijgevoegd. Dit is perfect voor ontwikkelaars die al een aangepast paginaontwerp hebben maar niet willen omgaan met het maken van hun eigen knopstijlen.

Je hebt praktisch onbegrensde keuzes en combinaties om uit te kiezen. Butns heeft meer dan 30 verschillende achtergrond / border-kleuren die je kunt mixen en matchen voor traditionele platte knoppen of pil-knoppen of zelfs Ghost-knoppen .

U kunt ook kiezen tussen verschillende verloopstijlen die twee verschillende kleuren aan elkaar passen. Deze verloopknoppen zien er fantastisch uit met een slagschaduw voor een verhoogd reliëfeffect.

Samen met kleuren en schaduwen kunt u ook de vorm, grootte en transparantie van elke knop wijzigen.

Alles wordt gecontroleerd via CSS-klassen, dus je hebt echt volledige toegang tot alles in de bibliotheek.

Wat ik het leukst vind aan Butns, is dat je eenvoudig kunt schakelen tussen verschillende stijlen door een klassenaam bij te werken . Er is geen overdreven complex systeem van het toevoegen van stijlen of het bewerken van een stylesheet. Je ruilt gewoon klassen, en je bent klaar om te gaan.

Hoewel het niet schadelijk is om sommige van deze lessen met uw eigen voorkeuren te overschrijven . Dat is de schoonheid van het cascaderingseffect in CSS.

Om te beginnen, downloadt u het .css bestand vanaf de Butns-startpagina of vanuit de GitHub-repo. Ze hebben allebei een link naar de meest actuele versie, dus beide manieren zijn in orde.

Nadat de toevoeging aan uw webpagina is toegevoegd, .button u alleen de .button te voegen aan alles dat u als een knop wilt laten vormgeven. Vanaf daar is het een kwestie van extra klassen toevoegen op basis van de kleuren, grootte en stijl van de gewenste knop.

Bekijk de GitHub-pagina in de buurt van de klassenlijst. U vindt een volledige lijst met alle klassen voor het aanpassen van de kleur, knoptype en weergaveopties, zoals klein / groot of semi-transparant.

Butns.css is gemakkelijk een van de meest uitgebreide knopstijlbladen op internet. U kunt het aan meerdere webprojecten toevoegen en ze kunnen allemaal een ander uiterlijk hebben met deze ene bibliotheek.

Het speelt ook goed samen met andere frameworks zoals Bootstrap omdat de classes elkaar niet overlappen . Dus je kunt Butns zonder problemen met bijna elk ander frontend framework op de markt samenvoegen.