Bootstrap知识

最新推荐文章于 2024-09-09 08:47:58 发布

雨落听风清

最新推荐文章于 2024-09-09 08:47:58 发布

阅读量475

点赞数

文章标签： bootstrap css html

本文链接：https://blog.csdn.net/Rock_clip/article/details/120607225

版权

Bootstrap 前端开发响应式布局版本更新开发效率

关键词由CSDN通过智能技术生成

1.Bootstrap框架优点

Ⅰ.对html和css编写代码进行了规范，也将它们标准化了

Ⅱ.为开发者提供了一套简洁、直观、和强悍的代码

Ⅲ.有自己的生态圈，不断地完善自己的功能，尽量去满足市场需求，即更新迭代速度快

Ⅳ.使开发更简单，提高了开发者的开发效率。

2.Bootstrap 版本问题
第一版本:2.0.0，已经停止维护,虽然兼容性好,但是代码不够简洁，功能不够完善。

第二版本：3.0.0，目前使用最多,稳定,但是放弃了IE6-IE7。对 IE8 支持但是界面效果不好,偏向用于开发响应式布局、移动设备优先的WEB 项目。

第三版本：4.0.0，目前不是很流行

第四版本：5.0.0，最新版本

3.如何使用Bootstrap框架

第一步：创建文件夹结构

第二步：

. 创建 html 骨架结构

   <!DOCTYPE html>
   <html lang="zh-CN">
     <head>
       <meta charset="utf-8">
       <meta http-equiv="X-UA-Compatible" content="IE=edge">
       <meta name="viewport" content="width=device-width, initial-scale=1">
       <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
       <title>Bootstrap 101 Template</title>

       <!-- Bootstrap -->
       <link href="css/bootstrap.min.css" rel="stylesheet">

       <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
       <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
       <!--[if lt IE 9]>
         <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
         <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
       <![endif]-->
     </head>
     <body>
       <h1>你好，世界！</h1>

       <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
       <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
       <!-- Include all compiled plugins (below), or include individual files as needed -->
       <script src="js/bootstrap.min.js"></script>
     </body>
   </html>