为什么使用 Bootstrap?

简介: 原文:为什么使用 Bootstrap? 为什么使用 Bootstrap? 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。 浏览器支持:所有的主流浏览器都支持 Bootstrap。
原文: 为什么使用 Bootstrap?

为什么使用 Bootstrap?

  • 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。
  • 浏览器支持:所有的主流浏览器都支持 Bootstrap。

    Internet Explorer Firefox Opera Google Chrome Safari

  • 容易上手:只要您具备 HTML 和 CSS 的基础知识,您就可以开始学习 Bootstrap。
  • 响应式设计:Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。更多有关响应式设计的内容详见 Bootstrap 响应式设计

    响应式设计

  • 它为开发人员创建接口提供了一个简洁统一的解决方案。
  • 它包含了功能强大的内置组件,易于定制。
  • 它还提供了基于 Web 的定制。
  • 它是开源的。

Bootstrap 包的内容

  • 基本结构:Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。
  • CSS:Bootstrap 自带以下特性:全局的 CSS 设置、定义基本的 HTML 元素样式、可扩展的 class,以及一个先进的网格系统。
  • 组件:Bootstrap 包含了十几个可重用的组件,用于创建图像、下拉菜单、导航、警告框、弹出框等等
  • JavaScript 插件:Bootstrap 包含了十几个自定义的 jQuery 插件。您可以直接包含所有的插件,也可以逐个包含这些插件。

     

  • 定制:您可以定制 Bootstrap 的组件、LESS 变量和 jQuery 插件来得到您自己的版本。

     


在线实例

本站的 Bootstrap 教程包含了上百个实例。

你可以使用我们的在线编辑器在线编辑代码,并点击运行按钮查看结果。

Bootstrap 实例

<div class="container">
  <p>Create a responsive table with alternating cell background color:</p> 
  
  <div class="table-responsive"> 
    <table class="table table-striped table-bordered">
      <thead>
        <tr>
          <th>#</th>
          <th>Name</th>
          <th>Street</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>Anna Awesome</td>
          <td>Broome Street</td>
        </tr>
        <tr>
          <td>2</td>
          <td>Debbie Dallas</td>
          <td>Houston Street</td>
        </tr>
        <tr>
          <td>3</td>
          <td>John Doe</td>
          <td>Madison Street</td>
        </tr>
      </tbody>
    </table>
  </div>

</div>

 

 

目录
相关文章
N..
|
安全 API 开发工具
如何升级Flutter
如何升级Flutter
N..
1276 1
|
API 数据库 数据安全/隐私保护
利用Django框架构建高效后端API服务
本文将介绍如何利用Django框架构建高效的后端API服务。通过深入分析Django框架的特性和优势,结合实际案例,探讨了如何利用Django提供的强大功能来构建高性能、可扩展的后端服务。同时,还对Django框架在后端开发中的一些常见问题进行了解决方案的探讨,并提出了一些建设性的建议。
554 30
|
Linux 网络安全 开发工具
Linux安装ssh以远程连接
Linux安装ssh以远程连接
2000 0
|
存储 Linux 编译器
Linux 交叉编译第三方库需要设置的环境变量
Linux 交叉编译第三方库需要设置的环境变量
1078 0
|
缓存 容灾 架构师
极客时间架构实战营总结
极客时间架构实战营总结
980 0
|
开发框架 安全 .NET
深入研究X-Powered-By头的安全隐患与解决方案
深入研究X-Powered-By头的安全隐患与解决方案
1216 0
|
数据安全/隐私保护 C++ UED
【教程】一个比较良心的 C++ 代码混淆器
【教程】一个比较良心的 C++ 代码混淆器
|
人工智能 编解码 数据安全/隐私保护
才发现百度自带的AI图片助手这么好用,去水印、画质优化、AI扩图、涂抹消除等功能一应俱全!
才发现百度自带的AI图片助手这么好用,去水印、画质优化、AI扩图、涂抹消除等功能一应俱全!
2465 0
|
人工智能 自然语言处理 搜索推荐
通义千问首次落地天玑9300移动平台
联发科天玑9300芯片携手阿里云通义千问大模型,实现移动端AI重大突破。通义千问在天玑9300上的高效运行,标志手机AI技术新高度,提供即时多轮对话体验。双方深度合作优化模型,通义千问18亿参数版在推理时内存占用低,速度高,为行业设定标准。双方启动AI智能体解决方案计划,推动下一代智能终端应用生态发展。高通等竞争对手也在加速大模型移动端部署,端侧AI市场竞争加剧。
801 1
通义千问首次落地天玑9300移动平台
|
前端开发 UED 容器
深入理解定位布局:绝对定位与相对定位
深入理解定位布局:绝对定位与相对定位