Uvod v Bootstrap 4 Cheatsheet
Navodila za Bootstrap 4 so vključila večjo prenovo sistema Bootstrap 3. Veliko sprememb se je zgodilo pri večini komponent, ki vključujejo tabele, obrazce, spustne vrstice, omrežja, navbarje itd. Glavne prednosti okvirov, kot je Bootstrap, je, da lahko pospešijo razvojni časi tudi pri ohranjanju kakovosti in doslednosti aplikacije na spletnem mestu. Navodila za Bootstrap 4 delujejo na vseh sodobnih brskalnikih nad internetnim raziskovalcem 9.
Pogon 4
Bootstrap 4 je najnovejša in najbolj napredna različica bootstrap-a. Je najbolj priljubljen okvir za HTML, CSS in JavaScript, ki se uporablja za razvoj odzivnih in mobilnih aplikacij. Bootstrap 4 kot starejše različice je brezplačen in odprtokoden. Ni nam treba več zapisovati in znova oblikovati vsega od talne ničle za različne sklope naprav. Poleg tega nam ni treba več ur zamolčati, da bi vse popravili in zagotovili, da je videti in deluje pravilno v različnih brskalnikih, edinstvenih platformah in napravah.
Ukazi in opis na Bootstrap 4 Cheatsheet
Nekaj pomembnih ukazov Bootstrap 4 in njihov opis je podan spodaj: -
| Ukazi | Opis |
| Fiksna posoda | Fiksna posoda ima fiksno širino. Pri spreminjanju velikosti brskalnika njegova širina ostane enaka, dokler ne najdete točke preloma. |
| Posoda s tekočino | Posoda s tekočino se razprostira na celotno širino razpoložljivega vidnega polja. Razširja se in strmi, kar pomeni, da se spreminja, ko se spremeni velikost brskalnika. |
| .Col- | Je za zelo majhne naprave - širina zaslona je manjša od 576px |
| .Col-sm- | Je za majhne naprave - širina zaslona ostane enaka ali večja od 576px |
| .Col-md- | Je za srednje naprave - širina zaslona ostane enaka ali večja od 768px |
| .Col-lg- | Je za velike naprave - širina zaslona je enaka ali večja od 992px |
| .Col-xl- | Je za večje naprave - širina zaslona je enaka ali večja od 1200 px |
- | h1 Naslov velikosti zagonske pasice z 2, 5rem = 40px h2 Naslov velikosti zagonske trakove z 2rem = 32 pik h3 Naslov velikosti zagonske palice z 1, 75rem = 28 pik h4 Naslov velikosti zagonske trakove z 1, 5rem = 24 pik h5 Naslov velikosti zagonske palice z 1, 25rem = 20 pik h6 Naslov velikosti zagonske trakove z 1rem = 16 pik |
| Ta element oznake HTML zagotavlja rumeno barvo ozadja z nekaj oblazinjenja | |
| Ta element oznake HTML vsebuje pikčasto obrobje. | |
|
| Razred dodaj s
se uporablja za citiranje blokov vsebine iz vira, ki so od zunaj. |
| .pogosto pisavo | Za krepko besedilo |
| .font-poševno | Za ležeče besedilo |
| .font-teža-lahka | Za besedilo z majhno težo |
| .font-teža-normalno | Za običajno besedilo |
| .lead | Odstavek vidno izstopa |
| . malo | Označuje manjše besedilo, tj. Zmanjša velikost pisave na 85% velikosti nadrejenega. |
| .tekst levo | Nakazuje, da je besedilo poravnano v levo. |
| .text - * - levo | Nakazuje, da je besedilo poravnano levo na vseh zaslonih velikosti |
| .text-center | Označuje besedilo poravnano po sredini |
| .text - * - sredina | Nakazuje besedilo poravnano na sredini na vseh zaslonih velikosti |
| .tekst desno | Označuje besedilo poravnano po desni |
| .text - * - desno | Nakazuje desno poravnano besedilo na vseh zaslonih velikosti |
| .text-utemeljiti | Nakazuje upravičeno besedilo |
| .text-monospace | Besedilo je v enobarvnem obsegu |
| .text-zdajrap | Nakazuje, da besedilo ni zavito |
| .text - mala črka | Označuje besedilo z malo začetnico |
| .text - velika črka | Označuje veliko besedilo |
| .text-velikim začetnikom | Označuje veliko besedilo |
| .inicijalizem | Prikaže besedilo znotraj elementa oznake HTML v pisavi manjše velikosti. Odstrani razpoložljiv privzeti slog seznama in levi rob na seznamih, ki so gnezdeni seznami |
| .table | Razred doda osnovno oblikovanje na mizo. |
| .stostavljen | Razred na mizo doda zebre-črte. |
| .omejen | Razred doda meje na vseh straneh tabele in celic. |
| .table-lebdenje | Razred doda učinek lebdenja, tj. Sivo barvo ozadja na razpoložljivih vrsticah tabel. |
| .table-temen | Razred doda črno ozadje tabeli. |
Brezplačni nasveti in triki o uporabi Bootstrap 4 Cheat sheet: -
V tem razdelku je omenjenih nekaj kul nasvetov in trikov za hitro krajšanje funkcij goljufije bootstrap 4 in ustvarjanje neverjetne aplikacije za mobilne naprave: -
- Z uporabo. col- (prelomna točka) -push- (številka) ali pri uporabi. stolpci col- (prelomna točka) -pull- (število) v stolpce, zaporedje določenih stolpcev je mogoče spremeniti.
- Za hitro in enostavno skrivanje elementa samo na napravah xs obstaja: hidden-xs razred, to lahko uporabite za skrivanje.
- . razred skrite (prelomne) točke se lahko uporablja tudi za preostale točke preloma in če je mogoče kombinirati skrit obseg, kot je omenjeno zgoraj. Primer: - razredi .hidden-LG, .hidden-MD, .hidden-sm.
- Bootstrap je na voljo s 5 privzetih razpoložljivih stilov gumbov: privzeti, primarni, uspešni in nevarni. Ko je treba gumb spremeniti, da zmanjšate polmer obrobe ali oblazinjenje, je najboljši način, da to dosežete s prepisovanjem .btn
- Če želite onemogočiti radijske sprejemnike in potrditvena polja, morate dodati onemogočen razred nadrejenemu elementu .checkboxor to.radio. nato dodamo onemogočen atribut posebnemu vhodu
- Če želite onemogočiti gumbe, dodajte atribut onemogočenih gumbom oznake HTML
Ali isto lahko storite tudi z dodajanjem .disabled razreda v gumbe.
- Za enostavno centriranje blokovnega elementa vodoravno in temu dodajte razred sredinskega bloka, kot v.
- Če želite hitro doseči vmesno vsebino v vmesniku ali narediti elemente vgrajenega bloka znotraj diva, dodajte .text-center class v nadrejeni element.
- Videoposnetke z YouTuba lahko enostavno vstavite tudi z uporabo vdelanega odziva Bootstrap, ki je pomočnik. vgrajen-odziven-16by9 ali vgrajen-odziven-4by3 mora biti izbran na podlagi razmerja stran videoposnetka
Bootstrap 4 Cheat list - zaključek
Zgoraj goljufiva bootstrap 4 ponuja vpogled v to, kar je mogoče s zagonsko kopico 4. Toda na voljo je bolj obsežen vodnik s tisoči drugih parametrov in oznak. Očitno je, da informacij o vseh ne moremo zagotoviti v enem samem članku, tudi razvijalci si morajo zapomniti vse oznake in razrede za razvoj. Najboljši in najbolj priporočljiv pristop je, da se takšni lističi hranijo pri roki, uporabnik pa se mora sklicevati na takšne liste, kadar koli se pojavijo potrebe. To bo zagotovilo, da bo vse delo opravljeno v času, ko je to potrebno, in izboljšalo uporabnikovo razumevanje in poznavanje zagonske stopnje 4 v določenem obdobju.
Priporočeni članek
To je vodnik za Bootstrap 4 Cheat list, tukaj smo razpravljali o vsebini in ukazu ter o brezplačnih nasvetih in trikih Bootstrap 4 Cheat sheet. Če želite izvedeti več, si oglejte tudi naslednji članek -
- CSS Cheat Sheet CSS
- Bootstrap proti Jquery Razlike
- Preprost in uporaben vodnik za goljufijo SQL
- Ultimate cheats sheet for C ++ Programming Language (Osnove)