BootStrap结合Hbuilder使⽤
1 BootStrap的优点
BootStrap是现在最受欢迎的前端框架，对css、js等进⾏了封装。优点先列在这⾥，后⾯使⽤的过程中会慢慢体会到BootStrap的好处。
1. 受欢迎，社区⾥⾯有⼤量的开发者，随时能帮助你解决很多问题；
2. 做出来的⽹站⾮常好看，⽽且学习门槛相对较低；
3. 可以适应各个尺⼨的屏幕，⼤到台式机，⼩到⼿机；
4. 稳定⽽灵活的栅格系统；
linux装oracle5. 定制的 jQuery 内置插件
2 BootStrap下载
我下载的版本是3.3.5，下载之后解压，会看到⾥⾯有三个⽂件夹
c语言常用框架点开其中的CSS⽂件夹，会看到有以下⽂件，其实bootstrap.css和bootstrap.min.css是⼀样的，后者去掉了前者中的注释和留⽩。开发中主要使⽤的是bootstrap.min.css
3 开发⼯具Hbuilder
4 新建前端项⽬
打开Hbuilder，左上⾓—⽂件—新建—web项⽬，命名为MyWebApp并确定路径。
下⼀步我们要做的就是导⼊BootStrap。右键项⽬名称，选择导⼊—常规—-⽂件系统—浏览—-选中之后打勾，确认即可
5 源代码及详细注释
最终的效果如图所⽰：
下⼀步就是编写代码了。右键MyWebApp，新建html⽂件，并修改其为
jquery下载的文件怎么使用
1. <head>
2. <meta charset="utf-8">
3. <title></title>
霹雳布袋戏普通话版
4. <link rel="stylesheet" href="css/bootstrap.min.css" />
5. <script type="text/javascript" src="js/jquery-3.0.0.min.js" ></script>
6. <script type="text/javascript" src="js/bootstrap.min.js" ></script>
7. </head>
1. <!DOCTYPE html>
2. <html>
3. <head>
4. <meta charset="utf-8">
5. <title></title>
6. <link rel="stylesheet" href="css/bootstrap.min.css" />
7. <!--导⼊⼀个可以⿏标悬浮显⽰下拉菜单的css-->
霹雳娇娃什么意思8. <link rel="stylesheet" href="css/extend.css" />
9. <script type="text/javascript" src="js/jquery-3.0.0.min.js" ></script>
0. <script type="text/javascript" src="js/bootstrap.min.js" ></script>
1. </head>
12.
3. <body>
4. <!--导航栏，设置属性为⽆论怎么滚动页⾯，导航栏都在顶部，当然也可以设置为bottom-->
5. <nav class="nav navbar-default navbar-fixed-top" role="navigation">
6. <!--导航栏采取流布局⽅式-->
7. <div class="container-fluid">
18.redis key长度限制
9. <div class="navbar-header">
0. <!--浏览器界⾯⼩于⼀定阀值的时候，将会出现⼀个有三条横线的按钮，点击可以展开隐藏内容-->
1. <a href="#" class="navbar-brand">
2. <img src ="img/icon0.png" />
3. </a>
24.
5. <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
6. <span class="icon-bar"></span>
7. <span class="icon-bar"></span>
8. <span class="icon-bar"></span>
9. </button>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。