Koçberî ji 2.x ber 3.0

Bootstrap 3 bi v2.x re ne lihevhatî ye. Vê beşê wekî rêbernameyek gelemperî ji nûvekirina ji v2.x ber v3.0 bikar bînin. Ji bo serpêhatiyek berfireh, bibînin ka çi nû di ragihandina berdana v3.0 de heye.

Guhertinên çîna sereke

Ev tablo guheztina şêwazê di navbera v2.x û v3.0 de nîşan dide.

Bootstrap 2.x 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 Parçe kirin.visible-md .visible-lg
.hidden-phone .hidden-xs
.hidden-tablet .hidden-sm
.hidden-desktop Parçe kirin.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

Çi nû ye

Me hêmanên nû lê zêde kir û hin yên heyî guhert. Li vir şêwazên nû an nûvekirî hene.

Pêve Terîf
Panels .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse
Lîsteya komên .list-group .list-group-item .list-group-item-text .list-group-item-heading
Glyphicons .glyphicon
Jumbotron .jumbotron
Tora pir piçûk (<768px) .col-xs-*
Tûra piçûk (≥768 px) .col-sm-*
Tûra navîn (≥992 px) .col-md-*
Tora mezin (≥1200px) .col-lg-*
Dersên kargêriya bersivdar (≥1200px) .visible-lg .hidden-lg
Offsets .col-sm-offset-* .col-md-offset-* .col-lg-offset-*
Lêqellibînî .col-sm-push-* .col-md-push-* .col-lg-push-*
Kişandin .col-sm-pull-* .col-md-pull-* .col-lg-pull-*
Mezinahiyên bilindahiya Input .input-sm .input-lg
komên Input .input-group .input-group-addon .input-group-btn
Kontrolên formê .form-control .form-group
Mezinahiyên koma bişkokê .btn-group-xs .btn-group-sm .btn-group-lg
Navbar text .navbar-text
Sernavê Navbar .navbar-header
Tabên / hebên rastdar .nav-justified
Wêneyên bersivdar .img-responsive
Rêzên tabloya hevoksaziyê .success .danger .warning .active .info
Panelên hevoksaziyê .panel-success .panel-danger .panel-warning .panel-info
Modal .modal-dialog .modal-content
Wêneya hûrgelê .img-thumbnail
Mezinahiyên baş .well-sm .well-lg
Girêdanên hişyariyê .alert-link

Çi hatiye rakirin

Hêmanên jêrîn di v3.0 de hatine avêtin an guhertin.

Pêve Ji 2.x rakirin 3.0 Wekhev
Çalakiyan çêbikin .form-actions N/A
Forma lêgerînê .form-search N/A
Komek bi agahdarî ava bikin .control-group.info N/A
Mezinahiyên têketina sabît-width .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge Bikaranîn .form-controlû sîstema grid şûna.
Ketina forma asta astê asteng bike .input-block-level Wekheviya rasterast tune, lê formên kontrolê wekhev in.
Bişkokên berevajî .btn-inverse N/A
Rêza şilavê .row-fluid .row(bêtir tora sabît tune)
Wrapper kontrol dike .controls N/A
Rêzê kontrol dike .controls-row .rowan.form-group
Navbara hundurîn .navbar-inner N/A
Navbar dabeşkerên vertical .navbar .divider-vertical N/A
Binmenûya dakêşanê .dropdown-submenu N/A
Alignments Tab .tabs-left .tabs-right .tabs-below N/A
Qada tabê-based pill .pill-content .tab-content
Paceya qada tabable-based pill .pill-pane .tab-pane
Nav lîsteyên .nav-list .nav-header Wekheviya rasterast tune, lê komên navnîş û .panel-groups wekhev in.
Alîkariya hundurîn ji bo kontrolên formê .help-inline Wekheviya rastîn tune, lê .help-blockwekhev e.
Rengên pêşveçûnê yên ne-bar-asta .progress-info .progress-success .progress-warning .progress-danger .progress-bar-*Li şûna wê bikar .progress-barbînin.

Têbînî Additional

Guhertinên din ên di v3.0 de tavilê ne diyar in. Dersên bingehîn, şêwazên sereke, û tevger ji bo nermbûn û nêzîkatiya meya yekem a mobîl hatine sererast kirin . Li vir navnîşek qismî heye:

  • Bi xwerû, kontrolên forma-based nivîsê naha tenê şêwazek hindiktirîn werdigirin. Ji bo rengên balkêş û quncikên dorpêçkirî, .form-controlçîna li ser hêmanê bi şêwazê bicîh bikin.
  • Kontrolên form-based nivîsê yên bi .form-controlçîna ku tê sepandin naha ji hêla xwerû ve %100 fireh in. Keyanên têketinê di hundurê <div class="col-*"></div>xwe de bipêçin da ku firehiyên têketinê kontrol bikin.
  • .badgeêdî dersên kontekstî (-serkeftin,-seretayî, hwd..) tune.
  • .btndivê her weha bikar bînin .btn-defaultda ku bişkoka "default" bistînin.
  • .rowniha şil e.
  • Wêne ji hêla xwerû ve êdî ne bersivdar in. Ji .img-responsivebo <img>mezinahiya şilavê bikar bînin.
  • Îkon, naha .glyphicon, naha li ser bingeha tîpan in. Ji îkonan jî çîna bingeh û îkonê (mînak .glyphicon .glyphicon-asterisk).
  • Typeahead hatiye avêtin, ji bo bikaranîna Twitter Typeahead .
  • Nîşana modal bi girîngî guherî. Beşên .modal-header, .modal-body, û .modal-footernaha di nav de hatine pêçan .modal-contentû .modal-dialogji bo şêwaz û behremendiya mobîl çêtirîn. Di heman demê de, divê hûn êdî serî .hideli .modalnîşankirina xwe nedin.
  • Ji v3.1.0 ve, HTML-ya ku ji hêla remotevebijarka modal ve hatî barkirin, naha li şûna ku di nav de .modal-content(ji v3.0.0 heya v3.0.3, nav .modal) tê derzî kirin .modal-body. Ev rê dide we ku hûn ne tenê laşê modal, ne tenê sernav û pêlava modalê jî bi hêsanî biguhezînin.
  • Vebijêrk û taybetmendiyên radyoyê yên pêveka button.js naha hem data-toggle="buttons"li şûna data-toggle="buttons-checkbox"an jî data-toggle="buttons-radio"di nîşankirina xwe de bikar tînin.
  • Bûyerên JavaScript-ê bi navan têne danîn. Mînakî, ji bo birêvebirina bûyera modal "nîşan bide", bikar bînin 'show.bs.modal'. Ji bo tabloyên "nîşandanî" bikar bînin 'shown.bs.tab', hwd.

Ji bo bêtir agahdarî li ser nûvekirina v3.0, û perçeyên kodê yên ji civakê, li Bootply binêre .