bootstrap@twitter使用介绍

来源：互联网发布：linux dd u盘编辑：程序博客网时间：2024/05/18 08:50

bootstrap是twitter推出的含有css设计, javascript组件的一款web前端框架/解决方案，目前最新版本是v2.0。bootstrap的css在命名和结构方面都十分规范，基本都是按照意义命名，单词或缩写都是小写，并且多个单词或缩写之间用 ‘-’ 连接。bootstrap的javascript是采用jQuery框架，提供了一些常用的前端控件，灵活性/扩展性不是太好。

布局
bootstrap提供了一个12列的基本布局，在这个基本布局的基础上提供了固定宽度(container)和不固定宽度(container-fluid)的两种布局。
固定宽度的布局的宽度是940px。

<body>  <div class="container">    ...  </div></body>

不固定宽度的布局。

<div class="container-fluid">  <div class="row-fluid">    <div class="span2">      <!--Sidebar content-->    </div>    <div class="span10">      <!--Body content-->    </div>  </div></div>

bootstrap的12列网格通过span*来实现布局。

基本样式
bootstrap提供了基本的排版样式、表格、代码、表单和按钮的基本样式。

css组件
bootstrap提供了导航栏、菜单、下拉列表等。

javascript控件
一些常见前端控件都有，除了datepicker，期待在下一个版本出现。

bootstrap适合没有专职web前端开发人员的项目团队，使用bootstrap也能实现非常专业的前端页面。bootstrap也可以通过less定制样式。