BootStrap对开发者来说最大的好处就是响应式布局和一些优秀的样式。
现在我给大家介绍一些使用BootStrap的步骤和一些常用的东西。
1.编写头部
2.引入js
这个可以写在body
3.使用container类
container类是一个常用的div类
主要是用居中功能
4.使用栅格化系统
栅格化系统是BootStrap一个非常常用的一个布局系统
简单的使用如下
可以看到栅格化系统可以根据不同设备调整不同宽度
5.使用表格
表格标题 | 表格标题 | 表格标题 |
---|---|---|
表格内容 | 表格内容 | 表格内容 |
表格内容 | 表格内容 | 表格内容 |
表格内容 | 表格内容 | 表格内容 |
如果是想某一格变颜色也可以在th标签内加类像tr一样
6.使用表单
最基本的用法如下
Example block-level help text here.
如果将form的类设为form-inline则将所有元素显示在同一行
如果将form的类设为form-horizontal则每个form-group显示一行,不过要自己设置宽度
如
我们通常在注册账号时,信息错误或者正确他会在旁边提示,而且输入框的颜色会不同
Bootstrap给我们提供了这个很实用的功能
7.按钮
按钮是必不可少的一样东西
类中还可以添加尺寸
以上就是Bootstrap的使用步骤和常用用法
用上这个框架后不仅开发的速度上去了,质量也提升了。
如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:
Bootstrap学习教程
Bootstrap实战教程
Bootstrap插件使用教程
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。