2.x atanga 3.0 ah migrate a ni

Bootstrap 3 hi v2.x nen hian backwards a inmil lo. He section hi v2.x atanga v3.0 a upgrade dan tlangpui atan hmang ang che. A zau zawka hriat duh chuan v3.0 release announcement- a thil thar awmte chu en la.

Class lian tak tak inthlak danglamna

He table hian v2.x leh v3.0 inkara style inthlak dan a tarlang a.

Bootstrap chu 2.x a ni Bootstrap chu 3.0 a ni
.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 In\hen darh rawh.visible-md .visible-lg
.hidden-phone .hidden-xs
.hidden-tablet .hidden-sm
.hidden-desktop In\hen darh rawh.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

Eng thil thar nge

Element thar kan dah belh a, a awmsa thenkhat pawh kan thlak danglam bawk. Hetah hian style thar emaw updated emaw te chu kan rawn tarlang e.

Thil bul Hrilhfiahna
Panel te pawh a awm .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse
Group hrang hrangte list rawh .list-group .list-group-item .list-group-item-text .list-group-item-heading
Glyphicons te hi a ni .glyphicon
Jumbotron a ni .jumbotron
Grid te tak te (<768px) a awm bawk. .col-xs-*
Grid te tak te (≥768px) a ni. .col-sm-*
Grid laihawl (≥992px) a ni. .col-md-*
Grid lian tak (≥1200px) a ni. .col-lg-*
Utility class hrang hrang (≥1200px) te chu a chhang thei a ni. .visible-lg .hidden-lg
Offsets te a awm .col-sm-offset-* .col-md-offset-* .col-lg-offset-*
Nam .col-sm-push-* .col-md-push-* .col-lg-push-*
Pawt .col-sm-pull-* .col-md-pull-* .col-lg-pull-*
Input san zawng size hrang hrang .input-sm .input-lg
Input group hrang hrang te .input-group .input-group-addon .input-group-btn
Form control te pawh a awm .form-control .form-group
Button group lian leh te te .btn-group-xs .btn-group-sm .btn-group-lg
Navbar thuziak a ni .navbar-text
Navbar header a ni .navbar-header
Tabs / pills dik tak a ni .nav-justified
Responsive thlalak te .img-responsive
Contextual table row hrang hrangah a awm .success .danger .warning .active .info
Contextual panels te pawh a awm bawk .panel-success .panel-danger .panel-warning .panel-info
Modal a ni .modal-dialog .modal-content
Thumbnail thlalak a ni .img-thumbnail
Well size hrang hrang .well-sm .well-lg
Alert link a awm bawk .alert-link

Eng nge paih chhuah a ni

A hnuaia element te hi v3.0 ah hian drop emaw thlak emaw a ni tawh.

Thil bul 2.x atanga lakchhuah a ni 3.0 A tlukpui a ni
Form thiltih te .form-actions N/A a ni
Search form a ni .form-search N/A a ni
Info nen group siam rawh .control-group.info N/A a ni
Fixed-width input lian tham tak tak te .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge Use .form-controlleh grid system ai chuan.
Block level form a lut tur a ni .input-block-level Direct equivalent a awm lo a, mahse forms controls erawh a inang vek thung.
Inverse button a awm bawk .btn-inverse N/A a ni
Fluid row a awm .row-fluid .row(grid fixed a awm tawh lo)
Wrapper a control thin .controls N/A a ni
A thunun row .controls-row .rowemaw.form-group
Navbar chhungril lam a ni .navbar-inner N/A a ni
Navbar vertical divider te a awm bawk .navbar .divider-vertical N/A a ni
Submenu a rawn lang ang .dropdown-submenu N/A a ni
Tab alignment te a awm .tabs-left .tabs-right .tabs-below N/A a ni
Pill hmanga tabbable awmna hmun .pill-content .tab-content
Pill hmanga tabbable area pane hmanga siam a ni .pill-pane .tab-pane
Nav list te a awm .nav-list .nav-header Direct equivalent a awm lo a, mahse list group leh .panel-groups te hi a inang vek thung.
Form control-na atan inline-a tanpuina .help-inline A tlukpui dik tak a awm lo, mahse .help-blocka inang vek.
Bar level ni lo hmasawnna rawng hrang hrang .progress-info .progress-success .progress-warning .progress-danger A aiah chuan .progress-bar-*hmang rawh ..progress-bar

Thu belhchian dawl lo

v3.0-a inthlak danglamna dangte chu a lang nghal mai lo. Base class, key style, leh behavior te chu flexibility leh kan mobile first approach atan siamrem a ni. Hetah hian partial list kan rawn tarlang e:

  • Default-ah chuan text-based form control-te hian styling tlemte chauh an dawng tawh a ni. Focus color leh rounded corner atan .form-controlchuan element-a class chu style-ah apply la.
  • Tunah chuan class hman tawh text-based form controls chu .form-controldefault-in 100% a zau tawh a ni. <div class="col-*"></div>Input width control turin input te chu a chhungah wrap thin ang che.
  • .badgecontextual (-hlawhtlinna,-primary,etc..) class a nei tawh lo.
  • .btn.btn-default"default" button hmuh nan pawh hman tur a ni.
  • .rowtunah chuan fluid a ni tawh.
  • Images chu default-in a chhang thei tawh lo. .img-responsiveFluid <img>size atan hman tur.
  • Icons, now .glyphicon, te chu font based a ni tawh. Icon te hian base leh icon class (eg .glyphicon .glyphicon-asterisk) a mamawh bawk.
  • Typeahead chu paih a ni a, Twitter Typeahead hman duh tan a ni.
  • Modal markup pawh a danglam nasa hle. Tunah .modal-headerchuan , .modal-body, leh .modal-footersection te chu wrapped in .modal-contentleh .modal-dialogmobile styling leh behavior tha zawk neih theih nan a awm ta. Tin, i markup ah khan i apply tawh tur a ni lo .hide..modal
  • v3.1.0 atang khan remotemodal option hmanga HTML load chu tunah chuan . Hei hian awlsam takin modal body chauh ni lovin, header leh footer pawh awlsam takin a thlak danglam thei bawk..modal-content.modal.modal-body
  • Tunah chuan button.js plugin-a checkbox leh radio features te chu an markup data-toggle="buttons"aiah data-toggle="buttons-checkbox"emaw data-toggle="buttons-radio", an markup-ah emaw an hmang vek tawh.
  • JavaScript thil thlengte chu namespace a ni. Entirnan, modal "show" event handle tur chuan 'show.bs.modal'. Tab "shown" te tan chuan 'shown.bs.tab', etc. hmang rawh.

v3.0-a upgrade dan tur te, leh community atanga code snippets te hriat belh duh tan Bootply en rawh .