Mifindra avy amin'ny 2.x mankany 3.0

Bootstrap 3 dia tsy mifanaraka amin'ny v2.x. Ampiasao ity fizarana ity ho torolalana ankapobeny amin'ny fanavaozana avy amin'ny v2.x ho v3.0. Raha mila fijery mivelatra kokoa, jereo izay vaovao ao amin'ny fanambarana famoahana v3.0.

Fiovana kilasy lehibe

Ity tabilao ity dia mampiseho ny fiovan'ny fomba eo amin'ny v2.x sy 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 Zarao amin'ny.visible-md .visible-lg
.hidden-phone .hidden-xs
.hidden-tablet .hidden-sm
.hidden-desktop Zarao amin'ny.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

Inona ny vaovao

Nanampy singa vaovao izahay ary nanova ny sasany efa misy. Ireto ny fomba vaovao na nohavaozina.

singa Description
tontonana .panel .panel-default .panel-body .panel-title .panel-heading .panel-footer .panel-collapse
Tanisao ny vondrona .list-group .list-group-item .list-group-item-text .list-group-item-heading
Glyphicons .glyphicon
Jumbotron .jumbotron
Grid kely fanampiny (<768px) .col-xs-*
Grid kely (≥768px) .col-sm-*
Grid antonony (≥992px) .col-md-*
Grid lehibe (≥1200px) .col-lg-*
Kilasy fampiasa mandray andraikitra (≥1200px) .visible-lg .hidden-lg
maivana .col-sm-offset-* .col-md-offset-* .col-lg-offset-*
Atoseho .col-sm-push-* .col-md-push-* .col-lg-push-*
Sintony .col-sm-pull-* .col-md-pull-* .col-lg-pull-*
Haben'ny haavon'ny fidirana .input-sm .input-lg
Vondrona fampidirana .input-group .input-group-addon .input-group-btn
Fifehezana endrika .form-control .form-group
Haben'ny vondrona bokotra .btn-group-xs .btn-group-sm .btn-group-lg
Navbar text .navbar-text
Lohatenin'ny Navbar .navbar-header
Tavoahangy / pilina voamarina .nav-justified
Sary mamaly .img-responsive
Laharana latabatra contextual .success .danger .warning .active .info
tontonana contextual .panel-success .panel-danger .panel-warning .panel-info
Modal .modal-dialog .modal-content
Sary kely .img-thumbnail
Well sizes .well-sm .well-lg
Rohy fanairana .alert-link

Inona no nesorina

Ireto singa manaraka ireto dia nariana na novana tamin'ny v3.0.

singa Nesorina tamin'ny 2.x 3.0 Mitovy
Mamorona hetsika .form-actions N / A
Taratasy fikarohana .form-search N / A
Manaova vondrona misy fampahalalana .control-group.info N / A
Haben'ny fampidirana mirefy raikitra .input-mini .input-small .input-medium .input-large .input-xlarge .input-xxlarge Ampiasao .form-controlsy ny rafitra grid kosa.
Fampidirana endrika ambaratonga sakana .input-block-level Tsy misy mitovy mivantana, fa ny fanaraha- maso ny endrika dia mitovy.
bokotra inverse .btn-inverse N / A
Laharana ranon-javatra .row-fluid .row(tsy misy grid fixe intsony)
Controls wrapper .controls N / A
Mifehy andalana .controls-row .rowna.form-group
Navbar anatiny .navbar-inner N / A
Navbar mpizara mitsangana .navbar .divider-vertical N / A
Submenu midina .dropdown-submenu N / A
Fandrindrana tabilao .tabs-left .tabs-right .tabs-below N / A
Faritra tabbable mifototra amin'ny pilina .pill-content .tab-content
Paneo faritra misy tabilao mifototra amin'ny pilina .pill-pane .tab-pane
Nav lisitra .nav-list .nav-header Tsy misy mitovy mivantana, fa ny vondrona lisitra sy .panel-groupny s dia mitovy.
Fanampiana an-tserasera ho an'ny fanaraha-maso ny endrika .help-inline Tsy misy mitovy aminy, fa .help-blockmitovitovy.
Loko fandrosoana tsy misy bar .progress-info .progress-success .progress-warning .progress-danger Ampiasaina .progress-bar-*amin'ny .progress-barankapobeny.

Fanamarihana fanampiny

Ny fiovana hafa amin'ny v3.0 dia tsy hita avy hatrany. Ny kilasy fototra, ny fomba fototra ary ny fitondran-tena dia nasiam-panitsiana ho an'ny fahafaha-manatsara sy ny fomba fiasa voalohany amin'ny finday . Ity misy lisitra ampahany:

  • Amin'ny alàlan'ny default, ny fanaraha-maso amin'ny endrika mifototra amin'ny lahatsoratra izao dia mahazo endrika kely fotsiny. Ho an'ny loko mifantoka sy ny zorony boribory, ampiharo ny .form-controlkilasy amin'ny singa amin'ny fomba.
  • Ny fifehezana endrika mifototra amin'ny soratra miaraka amin'ny .form-controlkilasy ampiharina dia 100% amin'ny ankapobeny ankehitriny. Ampidiro ao anatiny <div class="col-*"></div>mba hifehezana ny sakan'ny fidirana.
  • .badgetsy manana kilasy contextual (-success,-primary, etc..) intsony.
  • .btntsy maintsy ampiasaina koa .btn-defaulthahazoana ny bokotra "default".
  • .rowdia fluid izao.
  • Tsy mamaly intsony ny sary raha ny default. Ampiasao amin'ny haben'ny .img-responsivefluid .<img>
  • Ny kisary, ankehitriny .glyphicon, dia mifototra amin'ny endritsoratra. Ny kisary koa dia mitaky kilasy fototra sy kisary (oh .glyphicon .glyphicon-asterisk).
  • Najanona ny Typeahead, ho an'ny fampiasana Twitter Typeahead .
  • Niova be ny mari-pamantarana. Ny .modal-header, .modal-body, ary ny .modal-footerfizarana dia nofonosina izao .modal-contentary .modal-dialogho an'ny styling sy fitondrantena finday tsara kokoa. Ary koa, tsy tokony hihatra amin'ny marikao intsony .hideianao .modal.
  • Amin'ny v3.1.0, ny HTML entin'ny remotesafidy modal dia ampidirina ao amin'ny .modal-content(avy amin'ny v3.0.0 ka hatramin'ny v3.0.3, ao amin'ny .modal) fa tsy ao amin'ny .modal-body. Izany dia ahafahanao manova mora foana ny lohapejy sy ny tongotry ny modal, fa tsy ny vatana modal.
  • Ny endri-tsarimihetsika sy ny radio amin'ny plugin button.js dia samy ampiasaina data-toggle="buttons"fa tsy data-toggle="buttons-checkbox"amin'ny data-toggle="buttons-radio"marika.
  • Ny hetsika JavaScript dia nomena anarana. Ohatra, hampiasa ny hetsika "show" modal 'show.bs.modal'. Ho an'ny tabilao "aseho" ampiasaina 'shown.bs.tab', sns.

Raha mila fanazavana fanampiny momba ny fanavaozana ny v3.0 sy ny sombin-kaody avy amin'ny vondrom-piarahamonina dia jereo ny Bootply .