您好,欢迎访问一九零五行业门户网

bootstrap2和3的区别是什么

区别:1、bootstrap3支持移动端优先,bootstrap没有;2、bootstrap2采用渐变凹凸风格,bootstrap3采用扁平化设计风格;3、bootstrap3的浏览器兼容性方面比bootstrap2好。
相关教程推荐:《bootstrap教程》
做项目时,有时也会参考别的案例的优秀之处。在用bootstrap的时候,发现很多项目代码都有区别,在<div>布局class上,有用.span*,有用.col-md-*,实际上是bootstrap版本升级,语法也变了。
bootstrap3中被修改的样式
bootstrap 2.xbootstrap 3.x
.container-fluid .container
.row-fluid .row
.span* .col-md-*
.offset* .col-md-offset-*
.brand .navbar-brand
.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-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-small .input-sm
.input-large .input-lg
.control-group .form-group
.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
bootstrap3.x中新增的样式
页面元素描述
panels .panel .panel-default .panel-body .panel-title .panel-heading.panel-footer.panel-collapse
list groups .list-group .list-group-item .list-group-item-text.list-group-item-heading
glyphicons .glyphicon
jumbotron .jumbotron
extra small grid (<768px) .col-xs-*
small grid (≥768px) .col-sm-*
medium grid (≥992px) .col-md-*
large grid (≥1200px) .col-lg-*
responsive utility classes (≥1200px) .visible-lg .hidden-lg
offsets .col-sm-offset-* .col-md-offset-* .col-lg-offset-*
push .col-sm-push-* .col-md-push-* .col-lg-push-*
pull .col-sm-pull-* .col-md-pull-* .col-lg-pull-*
input groups .input-group .input-group-addon .input-group-btn
form controls .form-control .form-group
button group sizes .btn-group-xs .btn-group-sm .btn-group-lg
navbar text .navbar-text
navbar header .navbar-header
justified tabs / pills .nav-justified
responsive images .img-responsive
contextual table rows .success .danger .warning .active
contextual panels .panel-success .panel-danger .panel-warning .panel-info
modal .modal-dialog .modal-content
thumbnail image .img-thumbnail
well sizes .well-sm .well-lg
alert links .alert-link
bootstrap3.x中被移除的样式
页面元素从2.x版本中去除3.x版本中对应的元素
form actions .form-actions n/a
search form .form-search n/a
form group with info .control-group.info n/a
fluid container .container-fluid .container (不再进行固定)
fluid row .row-fluid .row (不再进行固定)
controls wrapper .controls n/a
controls row .controls-row .row 或者.form-group
navbar inner .navbar-inner n/a
navbar vertical dividers .navbar .divider-vertical n/a
dropdown submenu .dropdown-submenu n/a
tab alignments .tabs-left .tabs-right.tabs-below n/a
nav lists .nav-list .nav-header 没有直接对等的样式t, 但是和list groups 和 .panel-groups相似

自bootstrap3起,框架包含了贯穿于整个库的移动设备优先的样式。
bootstrap2采用渐变凹凸风格,bootstrap3采用扁平化设计风格
bootstrap3的浏览器兼容性方面比bootstrap2好
如果你需要兼容ie8甚至是ie7和ie6,那么只能选择bootstrap2,虽然它自身在ie6的效果也并不完美。
以上就是bootstrap2和3的区别是什么的详细内容。
其它类似信息

推荐信息