Увод у Боотстрап компоненте

Првобитно назван Твиттер план, ово су развили Марк Отто и Јацоб Тхронтон на Твиттеру. Боотстрап је бесплатни ЦСС оквир који даје одзив на веб страницама. Одазивањем, то значи да се различити ДОМ елементи мењају у складу са променом величине екрана без нарушавања елеганције веб странице као што би се иначе догодило са традиционалним ЦСС методама за пикселе или проценте.

Ово се такође назива и „мобилни први“ ЦСС оквир јер је дизајниран тако да има ЦСС Грид изглед дефинисањем редова и ступаца. Овај оквир такође садржи ЈаваСцрипт компоненте заједно са ЦСС класама. Да бисте искористили овај оквир, обавезно требате повезати јКуери и ЈаваСцрипт Фрамеворк за Боотстрап заједно са осталим Боотстрап ЦСС датотекама. Ове ЦСС датотеке су доступне за преузимање, као и у облику ЦДН-а (Цонтент Деливери Нетворк).

Различите компоненте за покретање:

Боотстрап је у пакету са десетинама компоненти које се могу поново користити како би се пружило добро корисничко искуство и интеракције корисника на веб страници попут навигационих трака, скочних прозора, падајућих падајућих икона, икона, дугмади, унапред дизајнираних образаца и могућности подешавања различитих ДОМ елемената.

1) Глификони - Ово су иконе форматиране фонта које су доступне у програму Боотстрап. Њих је око 200. Ови глифони се могу наћи на хттпс://глипхицонс.цом.

Како се користи?
Постоје глифони који означавају готово све акције као што су зумирање, уређивање, упозорење, датотека, брисање итд. И дефинисане су у појединачној класи. Дакле, требате користити основну класу и индивидуалну класу, идеално у распону елемената и користити ове глифоне.

Синтакса:

2) Дропдовнс - Ово су листа менија на листи веза. ЈС додатак је динамичнији и може се наћи на хттп: // гетбоотстрап / јавасцрипт / # дропдовннс

Како се користи?
Морате користити класу .дропдовн јер класа елемента садржи ставке листе испод ње са класом .дропдовн-мену.

Синтакса:

3) Групе дугмића - Помоћу ове компоненте Боотстрап можете груписати скуп тастера заједно у низу један поред другог.

Како се користи?
Одредите елементе поделе са .бтн-цласс класе и гнездите те елементе дугметом са .бтн класом. Тацно
Погрешно

4) Падајуће типке - Ова компонента користи се за кориштење елемента дугмета за покретање пада.

Синтакса:

5) Групе уноса - Ово проширује класу контроле облика и додаје текст или дугмад са обе стране поља за унос елемента. Да бисте користили ове групе за унос, требате да користите .инпут-гроуп класу са .инпут-гроуп-аддон класом.

Синтакса:

@

6) Навбар - Ове компоненте служе као заглавље навигације за вашу веб локацију. Они се савијају како би се вертикално проширили помоћу преклопног менија хамбургера у уређајима мањих величина екрана и постају хоризонтални како се ширина екрана повећава.

Синтакса:

7) Јумботрон - Ово је компонента за покретање система која се може проширити преко целог екрана (или приказног поља ) како би се приказао неки кључни садржај.

Синтакса:

8) Упозорења - Ово је Боотстрап компонента са јКуери додатком који пружа контекстуалне повратне поруке овисно о радњи корисника. У основи се користи за приказивање порука упозорења.

Синтакса:

9) Траке напретка - Ова компонента користи се за пружање визуелних информација о повратним информацијама о напретку рада или акције помоћу траке напретка.

Синатк:

Пример:

10) Значке - Ово је компонента која означава нешто попут непрочитаних ставки додавањем класе .бадге у ​​ДОМ елемент, по могућности распон.

Синтакса:

Поруке 3

11) Пагинација - Ова компонента даје вашој веб страници више страница са страницама тако да садржај може

бити подељен на више страница и лако се кретати. Обично се елемент ДОМ за неоригулисане листе дефинише овом класом .пагинатион.

Синтакса:

    Како ће вам ово помоћи у каријери?

    Сва предузећа су се сада фокусирала на интеракцију корисника и корисничко искуство (УИ / УКС). Зато што велика већина становништва користи ручне уређаје попут таблета и паметних телефона који се увелике разликују у погледу резолуције пиксела и величине екрана. Због тога је заиста важно да дизајн са предњим делом буде довољно флексибилан да се може прилагодити било којој врсти екрана, а да не угрози елеганцију веб странице.

    Дакле, стручност у Боотстрап-у додала би вам вредност у техничкој каријери и компаније би се радују што ће вас запослити уз згодну плату. А, будући да је бесплатан и отвореног кода, има пуно опсега да допринесете као програмер и учините га још бољим од онога што је данас.

    Закључак-

    Оквир за покретање система је врло згодан алат за уношење реакција на веб странице. Компоненте објашњене на овом блогу су неке од најчешће коришћених које вам помажу да напишете мање кода за више функционалности и додате више елеганције веб страници коју правите.

    Препоручени чланци

    Ово је водич за Боотстрап Цомпонентс. Овде такође разматрамо увод и различите компоненте боотстрап-а заједно са његовом синтаксом. Можете и да прођете кроз друге наше предложене чланке да бисте сазнали више -

    1. Како инсталирати Боотстрап
    2. Ангулар вс Боотстрап
    3. Боотстрап курс за обуку
    4. Питања о интервјуу за покретање програма
    5. Како се користи распоред покретања?
    6. Топ 5 врста Боострап са узорком кода

    Категорија: