搜索
您的当前位置:首页正文

前端快速开发框架BootStrap示例

来源:二三娱乐

作为后端开发者,你可能和我一样都不太擅长设计,不过没关系,我们可以利用已有的优秀设计。如果你认同 Twitter 的简洁风格,那么 Twitter Bootstrap 是最好的选择。TwitterBootstrap 是由 Twitter 的设计师和工程师发起的开源项目,它提供了一套与 Twitter 风格一致的简洁、优雅的 Web UI,包含了完全由 HTML、CSS、JavaScript 实现的用户交互工具。不管你是资深的前端工程师,还是专业的后端开发者,你都可以轻松地使用Twitter Bootstrap 制作出优美的界面。

一、简单示例

需要使用Jquery,官网示例对Jquery使用了这种加载方式

<script 
    integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
    crossorigin="anonymous"></script>
    <!-- Bootstrap core CSS -->
    <link href="dist/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <button type="button" class="btn btn-primary">提交按钮</button>
    <button type="button" class="btn btn-success">成功按钮</button>
    <button type="button" class="btn btn-danger">危险按钮</button>
    <script src="jquery-3.3.1.js"></script>
    <script src="assets/js/vendor/popper.min.js"></script>
    <script src="dist/js/bootstrap.min.js"></script>
    <script src="assets/js/vendor/holder.min.js"></script>
  </body>
Top