zoukankan      html  css  js  c++  java
  • 5_bootstrap之响应式布局|列表|按钮

    5、响应式工具

    为针对性地在移动页面上展示和隐藏不同的内容,bootStrap提供响应式工具。

    可以让开发人员通过该工具决定,在何种屏幕尺寸下,隐藏或者显示某些元素

    帮助手册位置:全局CSS样式---响应式工具

     

    6、列表

    BootStrap同样提供了实用的列表样式供开发人员使用。

    帮助手册位置:全局CSS样式----排版----列表

    .list-inline

    将列表所有元素放置于一行

    示例:

     

    效果:

    7、按钮

    BootStrap提供了丰富的按钮样式供开发人员使用。

    帮助手册位置:全局CSS样式----按钮

    任何HTML元素加上以下样式都会变成对应按钮

    .btn btn-default

    示例:

    <a class="btn btn-default">Link</a>

    效果:

    .btn btn-primary

    示例:

    <a class="btn btn-primary">(首选项)Primary</a>

    效果:

    .btn btn-success

    示例:

    <a class="btn btn-success">(成功)Success</a>

    效果:

    .btn btn-info

    示例:

    <a class="btn btn-info">(一般信息)Info</a>

    效果:

    .btn btn-warning

    示例:

    <a class="btn btn-warning">(警告)Warning</a>

    效果:

            

    .btn btn-danger

    示例:

    <a class="btn btn-danger">(危险)Danger</a>

    效果:

       

    .active

    表示按钮被点击的样式

    示例:

    <a class=”btn btn-danger active”>(危险)Danger</a>

    效果:

       

    .disabled

    表示按钮被禁用的样式

    示例:

    <a class=”btn btn-danger disabled”>(危险)Danger</a>

    效果:

      

  • 相关阅读:
    clone对象
    Windows下swoole扩展的编译安装部署
    PHP备忘录
    Linux文档的压缩与打包
    Linux系统启动过程
    Linux虚拟机安装
    MongoDB自动增长
    MongoDB固定集合(Capped Collections)
    Activating Google Cloud Storage
    Downloading the Google Cloud Storage Client Library
  • 原文地址:https://www.cnblogs.com/alexzhang92/p/10078810.html
Copyright © 2011-2022 走看看