Bootstrap对自己的介绍是:简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。它是免费的开源的。

它的使用方法非常简单,从官网下载CSS、JavaScript、字体文件放在自己的网站文件夹下,将Bootstrap核心 CSS 文件、jQuery核心JavaScript文件(需另外至jQuery官网下载,Bootstrap依赖该文件,务必在Bootstrap核心JavaScript文件之前引入)和Bootstrap核心JavaScript文件引入自己的网页,然后调用各种组件构成自己的网页,还可以对样式进行调整,直到自己满意为止。

比如,你需要一个下拉菜单,那么就将下拉菜单触发器和下拉菜单都包裹在class=”dropdown"的一个div里。组成html的代码可以直接拷贝官网上的案例,如:

<div class="dropdown">
<button class="btn dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"> Dropdown <span class="caret"></span></button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
<li role="presentation" class="divider"></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>

刷新你的页面看一下吧,一个下拉菜单就呈现在你的眼前了!它还有更多组件等待着你去一一尝试哦!

当然你也可以定制组件,去掉多余的代码,节省网站流量。这只需在它的官网上进行一些选择和设置,然后再压缩下载就OK了!

转载请注明:知识蚂蚁 » 好用的前端开发框架Bootstrap

1访客评论

  1. :razz: 最近也有用bootstrap开发一个后台。很好用

    新一06-20 13:33 回复

我来说说

(便于我们更好的交流)

有不明白的地方欢迎留言哦~
取消