Муҳоҷират ба v3.x
Роҳнамо оид ба чӣ гуна навсозӣ аз Bootstrap v2.x ба v3.x бо таваҷҷӯҳ ба тағйироти асосӣ, чизҳои нав ва он чи хориҷ карда шудаанд.
Роҳнамо оид ба чӣ гуна навсозӣ аз Bootstrap v2.x ба v3.x бо таваҷҷӯҳ ба тағйироти асосӣ, чизҳои нав ва он чи хориҷ карда шудаанд.
Bootstrap 3 бо v2.x ба ақиб мувофиқ нест. Ин бахшро ҳамчун дастури умумӣ барои навсозӣ аз v2.x ба v3.0 истифода баред. Барои шарҳи васеътар, бубинед, ки дар эълони барориши v3.0 чӣ чизи нав мавҷуд аст.
Ин ҷадвал тағироти услубро байни v2.x ва 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 |
Ба тақсим кардан.visible-md .visible-lg |
.hidden-phone |
.hidden-xs |
.hidden-tablet |
.hidden-sm |
.hidden-desktop |
Ба тақсим кардан.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 |
Мо унсурҳои нав илова кардем ва баъзеи мавҷударо иваз кардем. Инҳоянд услубҳои нав ё навшуда.
Элемент | Тавсифи |
---|---|
Панелхо | .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse |
Рӯйхати гурӯҳҳо | .list-group .list-group-item .list-group-item-text .list-group-item-heading |
Глификонҳо | .glyphicon |
Ҷумботрон | .jumbotron |
Шабакаи хурди иловагӣ (<768px) | .col-xs-* |
Шабакаи хурд (≥768px) | .col-sm-* |
Шабакаи миёна (≥992px) | .col-md-* |
Шабакаи калон (≥1200px) | .col-lg-* |
Синфҳои хидматрасонии ҷавобгӯ (≥1200px) | .visible-lg .hidden-lg |
Офсетҳо | .col-sm-offset-* .col-md-offset-* .col-lg-offset-* |
Тела | .col-sm-push-* .col-md-push-* .col-lg-push-* |
Кашидан | .col-sm-pull-* .col-md-pull-* .col-lg-pull-* |
Андозаи баландии вуруд | .input-sm .input-lg |
Гурӯҳҳои воридотӣ | .input-group .input-group-addon .input-group-btn |
Назорати шакл | .form-control .form-group |
Андозаи гурӯҳи тугмаҳо | .btn-group-xs .btn-group-sm .btn-group-lg |
Матни Навбар | .navbar-text |
Сарлавҳаи Навбар | .navbar-header |
Ҷадвалҳо / доруҳои асоснок | .nav-justified |
Тасвирҳои ҷавобӣ | .img-responsive |
Сатрҳои ҷадвали контекстӣ | .success .danger .warning .active .info |
Панелҳои контекстӣ | .panel-success .panel-danger .panel-warning .panel-info |
Модал | .modal-dialog .modal-content |
Тасвири эскиз | .img-thumbnail |
Андозаҳои хуб | .well-sm .well-lg |
Истинодҳои огоҳкунанда | .alert-link |
Унсурҳои зерин дар v3.0 партофта шудаанд ё тағир дода шудаанд.
Элемент | Аз 2.x хориҷ карда шуд | 3.0 Муодил |
---|---|---|
Амалҳои шакл | .form-actions |
Не |
Шакли ҷустуҷӯ | .form-search |
Не |
Гурӯҳро бо маълумот ташкил кунед | .control-group.info |
Не |
Андозаи вуруди паҳнои собит | .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge |
.form-control Ба ҷои он системаи шабакаро истифода баред . |
Вуруди шакли блоки сатҳи | .input-block-level |
Муодили мустақим нест, аммо идоракунии шаклҳо шабеҳанд . |
Тугмаҳои баръакс | .btn-inverse |
Не |
Қатори моеъ | .row-fluid |
.row (шабакаи собит дигар нест) |
Сарпӯшро назорат мекунад | .controls |
Не |
Сатрро назорат мекунад | .controls-row |
.row ё.form-group |
Навбари дохилӣ | .navbar-inner |
Не |
Навбар тақсимкунакҳои амудӣ | .navbar .divider-vertical |
Не |
Зерменюи афтанда | .dropdown-submenu |
Не |
Ҳамоҳангсозии ҷадвалҳо | .tabs-left .tabs-right .tabs-below |
Не |
Минтақаи таблиғшаванда дар асоси ҳабҳо | .pill-content |
.tab-content |
Панели майдони tabbable дар асоси њабњо | .pill-pane |
.tab-pane |
Рӯйхати нав | .nav-list .nav-header |
Муодили мустақим нест, аммо гурӯҳҳо ва .panel-group s рӯйхат шабеҳанд. |
Кӯмаки дохилӣ барои идоракунии шакл | .help-inline |
Муодили дақиқ нест, аммо .help-block шабеҳ аст. |
Рангҳои пешрафти сатҳи ғайрибарӣ | .progress-info .progress-success .progress-warning .progress-danger |
.progress-bar-* Ба ҷои он истифода баред .progress-bar . |
Дигар тағирот дар v3.0 дарҳол маълум нестанд. Синфҳои асосӣ, услубҳои асосӣ ва рафторҳо барои чандирӣ ва равиши аввалини мобилии мо тасҳеҳ карда шуданд. Дар ин ҷо як рӯйхат қисман аст:
.form-control
синфро дар элемент ба услуб татбиқ кунед..form-control
синфи татбиқшаванда ҳоло ба таври нобаёнӣ 100% васеъ мебошанд. <div class="col-*"></div>
Барои назорат кардани паҳнои вуруд вурудҳоро дар дохили он печонед ..badge
дигар синфҳои контекстӣ (-муваффақият,-ибтидоӣ ва ғайра) надорад..btn
низ бояд .btn-default
барои ба даст овардани тугмаи "пешфарз" истифода..row
ҳоло моеъ аст..img-responsive
моеъ истифода баред .<img>
.glyphicon
ба ҳарф асос ёфтаанд. Нишонаҳо инчунин синфи асос ва нишонаро талаб мекунанд (масалан .glyphicon .glyphicon-asterisk
)..modal-header
, .modal-body
, ва .modal-footer
ҳоло барои ороиш ва рафтори беҳтари мобилӣ печонида .modal-content
шудаанд .modal-dialog
. Ғайр аз он, шумо набояд дигар дар қайди худ муроҷиат .hide
кунед .modal
.remote
, ҳоло ба ҷои ба . Ин ба шумо имкон медиҳад, ки ба осонӣ сарлавҳа ва поёни модалиро тағир диҳед, на танҳо бадани модалӣ..modal-content
.modal
.modal-body
data-toggle="buttons"
ба ҷои data-toggle="buttons-checkbox"
ё data-toggle="buttons-radio"
дар аломатгузории худ истифода мешаванд.'show.bs.modal'
. Барои ҷадвалҳои "нишон додашуда" истифода баред 'shown.bs.tab'
ва ғайра.Барои маълумоти бештар дар бораи навсозӣ ба v3.0 ва пораҳои код аз ҷомеа, нигаред ба Bootply .