Ukufuduka ukusuka ku-2.x ukuya kwi-3.0

I-Bootstrap 3 ayihambelani ngasemva ne-v2.x. Sebenzisa eli candelo njengesikhokelo jikelele ekuphuculeni ukusuka v2.x ukuya v3.0. Ukujonga ngokubanzi, bona ukuba yintoni entsha kwisibhengezo sokukhutshwa kwe-v3.0.

Iinguqu ezinkulu zeklasi

Le theyibhile ibonisa utshintsho lwesimbo phakathi kwe-v2.x kunye ne-v3.0.

I-Bootstrap 2.x I-Bootstrap 3.0
.row-fluid .row
.span* .col-md-*
.offset* .col-md-offset-*
.brand .navbar-brand
.navbar .nav .navbar-nav
.nav-collapse .navbar-collapse
.nav-toggle .navbar-toggle
.btn-navbar .navbar-btn
.hero-unit .jumbotron
.icon-* .glyphicon .glyphicon-*
.btn .btn .btn-default
.btn-mini .btn-xs
.btn-small .btn-sm
.btn-large .btn-lg
.alert .alert .alert-warning
.alert-error .alert-danger
.visible-phone .visible-xs
.visible-tablet .visible-sm
.visible-desktop Yahlula phakathi.visible-md .visible-lg
.hidden-phone .hidden-xs
.hidden-tablet .hidden-sm
.hidden-desktop Yahlula phakathi.hidden-md .hidden-lg
.input-block-level .form-control
.control-group .form-group
.control-group.warning .control-group.error .control-group.success .form-group.has-*
.checkbox.inline .radio.inline .checkbox-inline .radio-inline
.input-prepend .input-append .input-group
.add-on .input-group-addon
.img-polaroid .img-thumbnail
ul.unstyled .list-unstyled
ul.inline .list-inline
.muted .text-muted
.label .label .label-default
.label-important .label-danger
.text-error .text-danger
.table .error .table .danger
.bar .progress-bar
.bar-* .progress-bar-*
.accordion .panel-group
.accordion-group .panel .panel-default
.accordion-heading .panel-heading
.accordion-body .panel-collapse
.accordion-inner .panel-body

Yintoni entsha

Songeze izinto ezintsha kwaye satshintsha ezinye ezikhoyo. Nazi iindlela ezintsha okanye ezihlaziyiweyo.

Isiqalelo Inkcazo
Iiphaneli .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse
Dwelisa amaqela .list-group .list-group-item .list-group-item-text .list-group-item-heading
IiGlyphicons .glyphicon
Jumbotron .jumbotron
Igridi encinci kakhulu (<768px) .col-xs-*
Igridi encinci (≥768px) .col-sm-*
Igridi ephakathi (≥992px) .col-md-*
Igridi enkulu (≥1200px) .col-lg-*
Iiklasi eziluncedo eziphendulayo (≥1200px) .visible-lg .hidden-lg
I-Offsets .col-sm-offset-* .col-md-offset-* .col-lg-offset-*
Dudula .col-sm-push-* .col-md-push-* .col-lg-push-*
Tsala .col-sm-pull-* .col-md-pull-* .col-lg-pull-*
Ubungakanani bobude begalelo .input-sm .input-lg
Amaqela ongeniso .input-group .input-group-addon .input-group-btn
Ulawulo lwefom .form-control .form-group
Iqhosha lobungakanani beqela .btn-group-xs .btn-group-sm .btn-group-lg
Umbhalo weNavbar .navbar-text
Navbar okubhalwe ngasentla .navbar-header
Iithebhu / iipilisi ezifanelekileyo .nav-justified
Imifanekiso ephendulayo .img-responsive
Imiqolo yetheyibhile yomxholo .success .danger .warning .active .info
Iiphaneli zomxholo .panel-success .panel-danger .panel-warning .panel-info
Modal .modal-dialog .modal-content
Umfanekiso we-Thumbnail .img-thumbnail
Well ubukhulu .well-sm .well-lg
Iikhonkco zesilumkiso .alert-link

Yintoni esusiweyo

Ezi zinto zilandelayo ziye zalahlwa okanye zatshintshwa kwi-v3.0.

Isiqalelo Isusiwe ku-2.x 3.0 Iyalingana
Iintshukumo zefom .form-actions N / A
Khangela ifomu .form-search N / A
Yenza iqela ngolwazi .control-group.info N / A
Ubungakanani begalelo lobubanzi obulungisiweyo .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge Sebenzisa .form-controlkunye nenkqubo yegridi endaweni yoko.
Igalelo lefom yebhlokhi .input-block-level Akukho ukulingana ngokuthe ngqo, kodwa iifom zolawulo ziyafana.
Amaqhosha aguqulweyo .btn-inverse N / A
Umqolo wolwelo .row-fluid .row(akusekho gridi esisigxina)
Ilawula usonga .controls N / A
Umqolo wokulawula .controls-row .rowokanye.form-group
Navbar yangaphakathi .navbar-inner N / A
Izahluli zeNavbar ezithe nkqo .navbar .divider-vertical N / A
Imenu esezantsi eyehlayo .dropdown-submenu N / A
Ulungelelwaniso lwethebhu .tabs-left .tabs-right .tabs-below N / A
Indawo yetafile esekwe kwipilisi .pill-content .tab-content
Ipheyini yendawo yetafile esekelwe kwipilisi .pill-pane .tab-pane
Izintlu zeNav .nav-list .nav-header Akukho ukulingana ngokuthe ngqo, kodwa uluhlu lwamaqela kunye no- .panel-groups bayafana.
Uncedo lwangaphakathi kulawulo lwefom .help-inline Akukho nto ilinganayo, kodwa .help-blockiyafana.
Imibala yenkqubela phambili engekho-bar-level .progress-info .progress-success .progress-warning .progress-danger Sebenzisa .progress-bar-*endaweni .progress-baryoko.

Amanqaku ongezelelweyo

Olunye utshintsho kwi-v3.0 alubonakali ngokukhawuleza. Iiklasi ezisisiseko, izitayile eziphambili, kunye nokuziphatha zilungelelaniselwe ukuguquguquka kunye nendlela yethu yokuqala yeselula . Nalu uluhlu oluyinxenye:

  • Ngokungagqibekanga, ulawulo olusekwe kwiteksti ngoku lufumana isimbo esincinci kuphela. Ngemibala egxininisekileyo kunye neekona ezijikelezileyo, sebenzisa .form-controliklasi kwi-elementi kwisitayile.
  • Ulawulo lweefomu ezisekelwe kwisicatshulwa kunye .form-controlneklasi esetyenzisiweyo ngoku ziyi-100% ububanzi ngokungagqibekanga. Songa amagalelo ngaphakathi <div class="col-*"></div>ukuze ulawule ububanzi begalelo.
  • .badgeakusenazo iiklasi (-impumelelo,-primary, etc..)
  • .btnKufuneka usebenzise kwakhona .btn-defaultukufumana iqhosha elithi "default".
  • .rowilulwelo ngoku.
  • Imifanekiso ayisaphenduli ngokuzenzekelayo. Sebenzisa ubungakanani .img-responsivebolwelo <img>.
  • Ii-icon, ngoku .glyphicon, zisekwe kwifonti. Ii-ayikhoni zikwafuna isiseko kunye neklasi ye-icon (umz .glyphicon .glyphicon-asterisk.).
  • I-Typehead iye yalahlwa, ngokuthanda ukusebenzisa i -Twitter Typeahead .
  • Ukumakishwa kweModal kutshintshe kakhulu. I- .modal-header, .modal-body, kunye .modal-footernamacandelo ngoku asongelwe .modal-contentkwaye .modal-dialogkwisitayile esingcono seselfowuni kunye nokuziphatha. Kwakhona, akufuneki usafaka isicelo .hidekuphawu .modallwakho.
  • Ukusukela nge-v3.1.0, i-HTML elayishwe ngokhetho lwemodal remotengoku ifakwe kwi .modal-content(ukusuka kwi-v3.0.0 ukuya kwi-v3.0.3, ukuya kwi .modal) endaweni yokungena kwi .modal-body. Oku kukuvumela ukuba ukwahluke ngokulula i-header kunye ne-footer ye-modal, hayi nje umzimba we-modal.
  • Ibhokisi yokukhangela kunye neempawu zerediyo zeqhosha.js iplagi ngoku zombini zisebenzisa data-toggle="buttons"endaweni data-toggle="buttons-checkbox"okanye kuphawu data-toggle="buttons-radio"lwazo.
  • Izehlo zeJavaScript zinezithuba zamagama. Umzekelo, ukusingatha isiganeko se-modal "show", sebenzisa 'show.bs.modal'. Kwiithebhu "ezibonisiwe" sebenzisa 'shown.bs.tab', njl.

Ukufumana ulwazi oluthe kratya malunga nokuphucula kwi-v3.0, kunye neekhowudi zekhowudi ezivela kuluntu, bona i-Bootply .