Tilføj prædesignede knapper til dit websted med Butns.css
Frontend rammer, såsom Bootstrap, kommer med deres egne knapper, men de har normalt ikke meget variation.
Den fri Butns bibliotek tilbud en masse custom button styles uden hele rammen vedhæftet. Dette er perfekt til udviklere, som Har allerede et brugerdefineret side design men ønsker ikke at håndtere deres egne knapper.
Du har næsten ubegrænsede valg og kombinationer at vælge imellem. Butns har over 30 + forskellige baggrunds- / kantfarver at du kan blande og matche til traditionelle flade knapper eller pille knapper eller endda spøgelsesknapper.
Du kan også vælge imellem forskellige gradientstile der samler to forskellige farver sammen. Disse gradienter knapper ser fantastisk ud med en drop skygge for en hævet præget effekt.
Sammen med farver og skygger kan du også ændre form, størrelse og gennemsigtighed af en hvilken som helst knap.
Alt er styret via CSS klasser, så du har virkelig fuldstændig adgang til alt i biblioteket.
Det, jeg kan lide mest om Butns, er, at du nemt kan skift mellem forskellige stilarter lige ved opdatering af et klassenavn. Der er ikke noget alt for komplekst system til at tilføje stilarter eller redigere et stylesheet. Du bytter bare klasser, og du er god til at gå.
Selvom der ikke er nogen skade i overskrive nogle af disse klasser med dine egne præferencer. Det er skønheden i den cascading effekt i CSS.
For at komme i gang bare download den .css
fil fra Butns hjemmeside eller fra GitHub repo. De linker begge til den mest up-to-date version, så begge veje er OK.
Når det er tilføjet til din webside, bare tilføj klassen .knap
til noget, du vil være formet som en knap. Derfra er det et spørgsmål om tilføjer ekstra klasser baseret på farverne, størrelsen og stilen på den knap, du vil have.
Tag et kig på GitHub-siden nede i nærheden af klasselisten. Du finder en fuld liste over alle klasser til at tilpasse farven, knappetypen og visningsindstillingerne som små / store eller halvgennemsigtige.
Butns.css er let et af de mest omfattende knapper på nettet. Du kan tilføje det til flere webprojekter, og alle kan har et andet udseende med dette ene bibliotek.
Det også spiller pænt med andre rammer såsom Bootstrap siden klasser overlapper ikke. Så du kan fusionere Butns med næsten enhver anden frontend ramme på markedet uden besvær.