7 uut funktsiooni, millele Bootstrapis tähelepanu pöörata 5

7 uut funktsiooni, millele Bootstrapis tähelepanu pöörata 5

Bootstrap 5 on tulnud suurte muudatustega, sealhulgas Internet Exploreri (IE) toe ja jQuery sõltuvuse vähenemine. Twitteri poolt välja töötatud Bootstrap on maailma populaarseim CSS -i raamistik. Avatud lähtekoodiga kasutajaliidese raamistik vaatab ennast tulevikku positsioneerima ja see on näinud, et see teeb v5-s murrangulisi muudatusi.





Bootstrapi langus IE jaoks on teinud sellest esimese veebiarendustööriista. See samm tuleneb sellest, et Internet Exploreri turuosa väheneb jätkuvalt, moodustades vähem kui 3% kõigist veebibrauseritest.





Lugege edasi, et näha, milliseid täiendusi Bootstrapis on tehtud ja kuidas need teid mõjutavad.





1. jQuery tugi

Bootstrap ei kasuta enam jQuery teeki. Arendusmeeskond on selle muudatuse rakendamiseks täiustanud JavaScripti teeki. JQuery sõltuvus ei olnud Bootstrapis tingimata halb.

Tegelikult muutis jQuery kasutuselevõtt radikaalselt JavaScripti kasutamist. See lihtsustas JavaScripti kirjutamisülesandeid, mis muidu oleksid võtnud palju koodiridu.



Seotud: Siit saate teada, kuidas jQuery'is elementi luua

Kõigest hoolimata on meeskond otsustanud sellest loobuda. Selle eeliseks on väiksemad lähtefailid ja pikem lehe laadimisaeg. See oli väga vajalik muudatus, mis näeb Bootstrapi tulevikusõbralikuma stiili.





Lähtefaili suurus on muutunud 85 KB JavaScripti võrra väiksemaks ja see on võtmetähtsusega, kuna Google peab mobiilisaitide lehtede laadimisaega paremusjärjestuseks.

Niipalju kui Bootstrap 5 -s pole jQuery kasutamist enam vaja, saate seda soovi korral siiski kasutada. Samuti väärib märkimist, et kõik JavaScripti pistikprogrammid jäävad kättesaadavaks.





2. CSS -i kohandatud atribuudid

Internet Exploreri toest loobudes saab kasutada kohandatud CSS -i atribuute (muutujaid). IE ei toeta kohandatud atribuute - vaid üks põhjus, miks see veebiarendajaid pikka aega tagasi hoidis.

CSS -i kohandatud omadused muudavad CSS -i paindlikumaks ja programmeeritavamaks. CSS -i muutujatele lisatakse eesliide -bs vältida konflikte kolmanda osapoole CSS -iga.

Saadaval on kahte tüüpi muutujaid: juurmuutujad ja komponendimuutujad.

Juurmuutujatele pääseb juurde igal pool, kus Bootstrap CSS on laaditud. Need muutujad asuvad _juur.scss faili ja on osa koostatud dist -failidest.

Komponentmuutujaid kasutatakse teatud komponentide kohalike muutujatena. Need aitavad vältida stiilide juhuslikku pärimist komponentides nagu pesastatud tabelid.

3. Täiustatud võrgusüsteem

Kuna versioonilt 3 versioonile 4 üleminekul esines mõningaid probleeme, säilitab Bootstrap 5 seekord suurema osa süsteemist, tuginedes olemasolevale süsteemile selle asemel, et seda täielikult muuta. Mõned muudatused on järgmised:

  • Vihmaveerennide klass ( .poisid ) on asendatud utiliidiga ( .g* ) sarnaselt veerisele ja polsterdusele
  • Lisatud on ka vertikaalsete vahekauguste klassid
  • Veergude jaoks pole enam vaikimisi määratud positsioon: sugulane

4. Täiustatud dokumentatsioon

Dokumente on täiendatud täiendava teabega, eriti kui tegemist on kohandamisega. Tavaline probleem oli see, et paljude Bootstrapi kasutavate saitide puhul võis kohe tuvastada, et see kasutab Bootstrapi. Bootstrap 5 on nüüd uue ilme ja parema kohandamisega.

Teemade kohandamiseks on nüüd rohkem paindlikkust, nii et kõik saidid või rakendused poleks sarnased. V4-teemalist lehte on tegelikult laiendatud rohkem sisu ja koodilõikudega, mis on mõeldud Sassi (populaarse CSS-i eeltöötleja) failide peale ehitamiseks. Stardiprojekti npm leiate ka GitHubi platvormilt, mis on saadaval mallide hoidlana.

Värvipaleti on laiendatud ka versioonis 5. Laiendatud sisseehitatud värvisüsteem eeldab, et saate värvimist hõlpsalt kujundada ilma koodibaasist lahkumata. Samuti on tehtud rohkem tööd värvikontrasti parandamiseks, sealhulgas lisatud Bootstrapi värvidokumentidesse värvikontrastsuse mõõdikud.

5. Täiustatud vormikontrollid

Bootstrap on täiustanud oma vormi juhtelemente, sisendrühmi ja palju muud.

Versioonis 4 kasutas Bootstrap lisaks iga brauseri vaikeväärtustele kohandatud vormi juhtelemente. V5 -s on need kõik nüüd kohandatud. Kõik raadionupud, märkeruudud, fail, vahemik ja palju muud, et anda neile sama välimus ja käitumine erinevates brauserites.

Uued vormikontrollid ei sisalda enam tarbetut värvikat märgistust, vaid keskenduvad selle asemel standardsetele ja loogilistele disainifunktsioonidele.

6. Bootstrap 5 lisab Utilities API

Pärast uusi CSS -teeke, nagu Tailwind CSS, lisab Bootstrap nüüd ka utiliitide kogu. Bootstrapi meeskond ütleb, et neil on hea meel näha, kuidas teised arendajad esitavad väljakutseid sellele, kuidas oleme viimase kümne aasta jooksul veebis üles ehitanud.

Utiliidid saavad arendusringkondades hoo sisse ja alglaadimismeeskond on seda märganud. Meeskond oli varem lisanud sätte v4 kommunaalteenuste jaoks, kasutades globaalset $ enable-* klassid. Versioonis 5 on need muutunud API lähenemisviisiks ning uueks keeleks ja süntaksiks Sassis. See annab teile õiguse uute utiliitide loomiseks, eemaldades või muutes antud vaikeseadeid.

Parema korralduse tagamiseks on mõned versioonis 4 olevad utiliidid viidud abistajate sektsiooni.

7. Uus Bootstrapi ikooniteek

Bootstrapil on nüüd oma avatud lähtekoodiga SVG ikoonikogu, kus on üle 1300 ikooni. See on kohandatud raamistiku komponentide jaoks, kuid saate nendega ikkagi mis tahes projekti kallal töötada.

Arvestades, et need on SVG -pildid, saab neid kiiresti skaleerida ja neid saab mitmel viisil rakendada ning kujundada ka CSS -iga.

Saate ikoone installida, kasutades üle merepinna:

$ npm i bootstrap-icons

Installige Bootstrap 5

Võite minna Bootstrap 5 ametlik allalaadimisleht kui soovite seda installida. Kui soovite kursis olla uusima arendusversiooniga, mida saate kasutada üle merepinna selle tõmbamiseks:

$ npm i bootstrap@next

Selle kirjutamise ajal on raamistik beetaversioonis 3. See tähendab, et tarkvara on ohutu kasutada, kuid alles arendamisel. Andke meeskonnale julgelt tagasisidet ja andke vajalik panus.

Jaga Jaga Piiksuma E -post Sissejuhatus veebikomponentidesse ja komponentidel põhinevasse arhitektuuri

Vaatame tavalisi veebikomponente ja selgitame, miks need kasulikud on.

Loe edasi
Seotud teemad
  • Programmeerimine
  • Veebiarendus
  • JavaScript
  • CSS
Autori kohta Jerome Davidson(22 artiklit avaldatud)

Jerome on MakeUseOfi personalikirjanik. Ta hõlmab artikleid programmeerimise ja Linuxi kohta. Ta on ka krüptohuviline ja jälgib alati krüptotööstust.

Veel Jerome Davidsonilt

Telli meie uudiskiri

Liituge meie uudiskirjaga, et saada tehnilisi näpunäiteid, ülevaateid, tasuta e -raamatuid ja eksklusiivseid pakkumisi!

süsteemiteenuse erandi viga Windows 10
Tellimiseks klõpsake siin