博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
bootstrap
阅读量:5037 次
发布时间:2019-06-12

本文共 1689 字,大约阅读时间需要 5 分钟。

bootstrap

简单、直观、强悍的前端开发框架,让web开发更迅速、简单。 来自Twitter,是目前很受欢迎的前端框架之一。 Bootrstrap是基于HTML、CSS、JavaScript的,让书写代码更容易。 移动优先,响应式布局开发。

bootstrap中文网址:

bootstrap 容器

  • container-fluid 流体
  • container
    • 1170
    • 970
    • 750
    • 100%

bootstrap 栅格系统

bootstrap将页面横向分为12等分,按照12等分定义了适应不同宽度等分的样式类,这些样式类组成了一套响应式、移动设备优先的流式栅格系统:

1、col-lg-2、col-md-3、col-sm-4、col-xs-

 

bootstrap响应式查询区间:

1、大于等于7682、大于等于9923、大于等于1200

 

bootstrap 表单

1、form 声明一个表单域2、form-inline 内联表单域3、form-horizontal 水平排列表单域4、form-group 表单组、包括表单文字和表单控件5、form-control 文本输入框、下拉列表控件样式6、checkbox checkbox-inline 多选框样式7、radio radio-inline 单选框样式8、input-group 表单控件组9、input-group-addon 表单控件组物件样式 10、input-group-btn 表单控件组物件为按钮的样式11、form-group-lg 大尺寸表单12、form-group-sm 小尺寸表单

 

bootstrap 按钮

1、btn 声明按钮2、btn-default 默认按钮样式3、btn-primay4、btn-success5、btn-info6、btn-warning7、btn-danger8、btn-link9、btn-lg10、btn-md11、btn-xs12、btn-block 宽度是父级宽100%的按钮13、active14、disabled15、btn-group 定义按钮组

 

bootstrap 图片

img-responsive 声明响应式图片

 

bootstrap 隐藏类

1、hidden-xs2、hidden-sm3、hidden-md4、hidden-lg

 

bootstrap 字体图标

通过字体代替图标,font文件夹需要和css文件夹在同一目录

bootstrap 下拉菜单

1、dropdown-toggle2、dropdown-menu

 

bootstrap 选项卡

1、nav2、nav-tabs3、nav-pills4、tab-content

 

bootstrap 导航条

1、navbar 声明导航条2、navbar-default 声明默认的导航条样式3、navbar-inverse 声明反白的导航条样式4、navbar-static-top 去掉导航条的圆角5、navbar-fixed-top 固定到顶部的导航条6、navbar-fixed-bottom 固定到底部的导航条7、navbar-header 申明logo的容器8、navbar-brand 针对logo等固定内容的样式11、nav navbar-nav 定义导航条中的菜单12、navbar-form 定义导航条中的表单13、navbar-btn 定义导航条中的按钮14、navbar-text 定义导航条中的文本9、navbar-left 菜单靠左10、navbar-right 菜单靠右

 

bootstrap 模态框

1、modal 声明一个模态框2、modal-dialog 定义模态框尺寸3、modal-lg 定义大尺寸模态框4、modal-sm 定义小尺寸模态框5、modal-header6、modal-body7、modal-footer

 

bootstrap 响应式专题网站实例

转载于:https://www.cnblogs.com/fwl8888/p/9327994.html

你可能感兴趣的文章
吴裕雄 python 机器学习——数据预处理嵌入式特征选择
查看>>
Centos6.4安装JDK
查看>>
201521123069 《Java程序设计》 第4周学习总结
查看>>
线性表的顺序存储——线性表的本质和操作
查看>>
【linux】重置fedora root密码
查看>>
数组的扩展
查看>>
关于空间背景颜色的操作
查看>>
HDU 6237 - A Simple Stone Game ( 分解质因数 )
查看>>
用swing做一个简单的正则验证工具
查看>>
百度坐标(BD-09)、国测局坐标(火星坐标,GCJ-02)和WGS-84坐标互转
查看>>
pig自定义UDF
查看>>
输入名字显示其生日,没有则让输入生日,做记录
查看>>
爬虫综合大作业
查看>>
HTML canvas原生js实现鼠标画图
查看>>
《程序设计入门——C语言》翁恺老师 第一周编程练习记录
查看>>
IE8兼容性视图问题
查看>>
Kubernetes 运维学习笔记
查看>>
Centos6.9下RabbitMQ集群部署记录
查看>>
Python之基本的日期与时间转换 datetime、 dateutil模块
查看>>
android studio
查看>>