zoukankan      html  css  js  c++  java
  • bootstrap 2.3版与3.0版的使用区别

    bootstrap 2.3版与3.0版的使用区别

    bootstrap已经推出了3.0的新版,看起来2.3.x版本也不会再更新了。那么bootstrap 2.3版与3.0版的区别在哪里呢?下面我们就来介绍一下。

    Bootstrap 3.0增加了一些新的特性,对于一些类也进行了调整。不过两个版本在使用的方法上是没什么大的区别的。

    bootstrap 2.3版与3.0版重要类的改变对比:

    Bootstrap 2.xBootstrap 3.0
    .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
    .visible-phone .visible-sm
    .visible-tablet .visible-md
    .visible-desktop .visible-lg
    .hidden-phone .hidden-sm
    .hidden-tablet .hidden-md
    .hidden-desktop .hidden-lg
    .input-small .input-sm
    .input-large .input-lg
    .checkbox.inline .radio.inline .checkbox-inline .radio-inline
    .input-prepend .input-append .input-group
    .add-on .input-group-addon
    .thumbnail .img-thumbnail
    ul.unstyled .list-unstyled
    ul.inline .list-inline

    bootstrap 3.0版新增的类

    ElementDescription
    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
    Tiny grid (<768 px) .col-xs-*
    Small grid (>768 px) .col-sm-*
    Medium grid (>992 px) .col-md-*
    Large grid (>1200 px) .col-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

    bootstrap 3.0版删除的类

    ElementRemoved from 2.x3.0 Equivalent
    Form actions .form-actions N/A
    Search form .form-search N/A
    Fluid container .container-fluid .container (no more fixed grid)
    Fluid row .row-fluid .row (no more fixed grid)
    Navbar inner .navbar-inner N/A
    Dropdown submenu .dropdown-submenu N/A
    Tab alignments .tabs-left .tabs-right .tabs-below N/A

    还有,常用的图标表示

    http://marcoceppi.github.io/bootstrap-glyphicons/

    http://bootstrap.ninghao.net/scaffolding.html#global

    http://www.runoob.com/bootstrap/bootstrap-v2-icons.html

  • 相关阅读:
    HDU 6143 Killer Names【dp递推】【好题】【思维题】【阅读题】
    HDU 6143 Killer Names【dp递推】【好题】【思维题】【阅读题】
    POJ 3974 Palindrome【manacher】【模板题】【模板】
    POJ 3974 Palindrome【manacher】【模板题】【模板】
    HDU 6127 Hard challenge【计算机几何】【思维题】
    HDU 6127 Hard challenge【计算机几何】【思维题】
    HDU 6129 Just do it【杨辉三角】【思维题】【好题】
    HDU 6129 Just do it【杨辉三角】【思维题】【好题】
    HDU 3037 Saving Beans【Lucas定理】【模板题】【模板】【组合数取余】
    8.Math 对象
  • 原文地址:https://www.cnblogs.com/panie2015/p/6061523.html
Copyright © 2011-2022 走看看