Heke ki v3.x
Aratohu me pehea te whakapai ake mai i Bootstrap v2.x ki v3.x me te aro nui ki nga huringa nui, nga mea hou, me nga mea kua tangohia.
Aratohu me pehea te whakapai ake mai i Bootstrap v2.x ki v3.x me te aro nui ki nga huringa nui, nga mea hou, me nga mea kua tangohia.
Ko te Bootstrap 3 kaore i te hototahi whakamuri ki te v2.x. Whakamahia tenei waahanga hei aratohu whanui mo te whakahou mai i te v2.x ki te v3.0. Mo te tirohanga whanui ake, tirohia nga mea hou i roto i te panui tuku v3.0.
Ko tenei ripanga e whakaatu ana i nga huringa ahua i waenga i te v2.x me te v3.0.
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 |
Wehea ki roto.visible-md .visible-lg |
.hidden-phone |
.hidden-xs |
.hidden-tablet |
.hidden-sm |
.hidden-desktop |
Wehea ki roto.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 |
Kua taapirihia e matou nga waahanga hou me te whakarereke i etahi o nga mea o mua. Anei nga ahua hou, kua whakahoutia ranei.
Huānga | Whakaahuatanga |
---|---|
Paewhiri | .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse |
Whakarārangihia ngā rōpū | .list-group .list-group-item .list-group-item-text .list-group-item-heading |
Glyphicons | .glyphicon |
Jumbotron | .jumbotron |
Matiti iti atu (<768px) | .col-xs-* |
Mātiti iti (≥768px) | .col-sm-* |
Mātiti Waenga (≥992px) | .col-md-* |
Mātiti nui (≥1200px) | .col-lg-* |
Nga karaehe whaipainga urupare (≥1200px) | .visible-lg .hidden-lg |
Wehenga | .col-sm-offset-* .col-md-offset-* .col-lg-offset-* |
Pana | .col-sm-push-* .col-md-push-* .col-lg-push-* |
Toia | .col-sm-pull-* .col-md-pull-* .col-lg-pull-* |
Rahi teitei whakauru | .input-sm .input-lg |
Rōpū whakauru | .input-group .input-group-addon .input-group-btn |
Puka mana whakahaere | .form-control .form-group |
Te rahi o te roopu roopu | .btn-group-xs .btn-group-sm .btn-group-lg |
Kuputuhi Navbar | .navbar-text |
Pane pae Navbar | .navbar-header |
Ripa tika / pire | .nav-justified |
Ko nga whakaahua whakautu | .img-responsive |
Nga rarangi ripanga horopaki | .success .danger .warning .active .info |
Nga panui horopaki | .panel-success .panel-danger .panel-warning .panel-info |
Modal | .modal-dialog .modal-content |
Atahanga karakōnui | .img-thumbnail |
Nga rahi pai | .well-sm .well-lg |
Hononga matohi | .alert-link |
Ko nga huānga e whai ake nei kua whakataka, kua whakarereketia ranei i roto i te v3.0.
Huānga | Kua tangohia mai i te 2.x | 3.0 Ōrite |
---|---|---|
Puka mahi | .form-actions |
N/A |
Puka rapu | .form-search |
N/A |
Puka roopu me nga korero | .control-group.info |
N/A |
Rahi whakaurunga whanui-whanui | .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge |
Whakamahia .form-control me te pūnaha mātiti kē. |
Paraka taumata puka tāuru | .input-block-level |
Karekau he rite tika, engari he rite nga mana puka . |
Pātene kōaro | .btn-inverse |
N/A |
Rarangi wai | .row-fluid |
.row (kaore he matiti pumau) |
Mana takai | .controls |
N/A |
Mana haupae | .controls-row |
.row ranei.form-group |
Navbar roto | .navbar-inner |
N/A |
Whakawehenga poutū Navbar | .navbar .divider-vertical |
N/A |
Tahuaroto takaiho | .dropdown-submenu |
N/A |
Ripa tīaroaro | .tabs-left .tabs-right .tabs-below |
N/A |
Te waahi papaa-a-papa | .pill-content |
.tab-content |
Pire horahanga ripanga-a-papa | .pill-pane |
.tab-pane |
Nga raarangi whakatere | .nav-list .nav-header |
Karekau he taurite tika, engari he rite nga roopu rarangi me .panel-group nga s . |
Āwhina rōraina mō ngā mana puka | .help-inline |
Karekau he tino rite, engari .help-block he rite tonu. |
Ko nga tae taumata-kore te ahunga whakamua | .progress-info .progress-success .progress-warning .progress-danger |
Whakamahia .progress-bar-* hei .progress-bar utu. |
Ko etahi atu huringa i roto i te v3.0 kaore e tino kitea. Ko nga karaehe turanga, nga momo matua, me nga whanonga kua whakatikahia mo te ngawari me te huarahi tuatahi mo te waea pūkoro . Anei tetahi rarangi waahanga:
.form-control
karaehe ki te huānga ki te ahua..form-control
karaehe i tono kua 100% te whanui ma te taunoa. Takaia nga whakauru ki roto <div class="col-*"></div>
hei whakahaere i nga whanui whakauru..badge
kua kore he akomanga horopaki (-angitu,-tuatahi, me era atu..)..btn
me whakamahi hoki .btn-default
ki te tiki i te paatene "taunoa"..row
he wai inaianei..img-responsive
mo te <img>
rahi o te wai..glyphicon
, kei runga momotuhi inaianei. Me hiahia hoki nga ata ki te turanga me te karaehe tohu (hei tauira .glyphicon .glyphicon-asterisk
)..modal-header
, .modal-body
, me .modal-footer
nga waahanga kua takai inaianei .modal-content
me .modal-dialog
te pai ake o te hanga waea me te whanonga. Ano hoki, kaua koe e tono .hide
ki .modal
to tohu.remote
whiringa aratau kua werohia inaianei ki roto i te .modal-content
(mai i te v3.0.0 ki te v3.0.3, ki te .modal
) hei utu ki te .modal-body
. Ma tenei ka taea e koe te whakarereke ngawari i te pane me te hiku o te tikanga, kaua ko te tinana noa.data-toggle="buttons"
hei utu mo o raatau tohu data-toggle="buttons-checkbox"
ranei data-toggle="buttons-radio"
.'show.bs.modal'
. Mo nga ripa "whakaatu" whakamahia 'shown.bs.tab'
, etc.Mo etahi atu korero mo te whakahou ake ki te v3.0, me nga waahanga waehere mai i te hapori, tirohia Bootply .