由于申请了一个域名,一个云主机,开始弄个人网站. 发现Bootstrap非常方便,和重要,故开始学习与分享关于Bootstrap的技术. 推个广告 个人网站:http://www.neverc.cn signalR做的一个讨论圈非常方便公司交流,哈哈!http://group 本节目录: 简介 入门 基本模板 CSS基本语法 JS基本语法 扩展 简介 Bootstrap是目前最流行的前端开发框架,由Twitter的两位前 员工Mark Otto和Jacob Thornton在2010年8月份创建…
作为Web前端开发框架,Bootstrap为大多数标准的UI设计常见提供了用户友好.扩浏览器的解决方案. 1.下载Bootstrap 打开官方网址 http://getbootstrap.com/ 进行下载. 2.准备项目模板文件夹 接下来,我们为第一个项目创建一个文件夹以及一些基本的文件.谓词我们还要用到HTML5样板文件 HTML5 Boilerplate(H5BP),然后把Bootstrap的有用文件复制过去. 2.1 下载H5BP 访问网站链接地址:https://html5boiler…
bootstrap 2.3版与3.0版重要类的改变对比 Bootstrap 2.x Bootstrap 3.0 .container-fluid .container .row-fluid .row .span* .col-md-* .offset* .col-md-offset-* .brand .navbar-brand .nav-collapse .navbar-collapse .nav-toggle .navbar-toggle .btn-navbar .navbar-btn .her…
在bs3.X中,提供了12种JavaScript插件,分别是:动画过渡(Transition).模态弹窗(Modal).下拉菜单(Dropdown).滚动侦测(Scrollspy).选项卡(Tab).提示 框(Tooltip).弹出框(Popover).警告框(Alert).按钮(Button).折叠(Collapse).旋转轮播(Carousel).定位浮标(Affix). 由于各种加班,身心疲惫... 动画过渡 源文件:transition.js 使用的动画过渡效果全部使用了 CSS3的语法…
Bootstrap框架的三大核心之二:组件. 组件也是最核心的地方,因为绝大部分的网页都必须利用组件才能构建出绚丽的页面. 组件包括:Icon图标(Glyphicon). 下拉菜单(Dropdown).按钮组(Button group).按钮下拉菜单(Button dropdown).输入框组(Input group).导航 (Nav).导航条(Navbar).面包屑导航(Breadcrumb).分 页导航(Pagination).标签(Label).徽章(Badge).大屏幕 展播(Jumbo…
Bootstrap三大核心内容的基础,即基础的CSS 布局语法.其包括基础排版(Typography).代码(Code).表 格(Tables).表单(Forms).按钮(Buttons).图片 (Images).辅助类(Helper Classes)和响应式设计 (Responsive utilities). 本节目录: 概述 基础排版 代码 表格 表单 按钮 图像 辅助样式 概述 HTML5文档类型 由于Bootstrap使用了HTML5特定的HTML元素和CSS属性,所 以使用Bootst…
大多数Bootstrap的使用者都认为Bootstrap只提供了CSS组件 和JavaScript插件,其实CSS组件和JavaScript插件只是Bootstrap框架的表现形式而已,它们都是构建在基础平台之上的. 本节目录: 整体架构 栅格系统 CSS组件架构 JS插件架构 禁用响应式布局 整体架构 12栅格系统 这是整个bs最核心的功能,也是响应式设计核 心理念的一个实现形式. 基础布局组件 bs提供了多种基础布局组 件,比如排版.代码.表格.按钮.表单等 jQuery bs所有的Java…
2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端工具集--BootStrap.Bootstrap由MARK OTTO和Jacob Thornton所设计和建立,在github上开源之后,迅速成为该站上最多人watch&fork的项目.大量工程师踊跃为该项目贡献代码,社区惊人地活跃,代码版本进化非常快速,官方文档质量极其高(可以说是优雅),同时涌现了许多基于Bootstrap建设的网站:界面清新.简洁;要素…
1.栅格系统实现布局的原理 1)Bootstrap把屏幕的宽度拆分成12格(列),每一格像素的多少由设备屏幕分辨率决定,我们在开发项目的过程中不需要去指定像素或者百分比. 2)不同范围的分辨率对应不同设备 超小屏幕 手机(<768px)               类的前缀:-col-xs- 小屏幕 平板(>=768px<992px)   类的前缀:-col-sm- 中等屏幕 桌面显示器(>=992px<1200px)类的前缀:-col-md- 大屏幕 大桌面显示器(>…
调用 BootStrap Table 方法的语法: $('#table').bootstrapTable('method', parameter); 例如: $('#my_table').bootstrapTable('refreshOptions', { data: tabledata }); //刷新表格  tabledata 为数据 $("#my_table").bootstrapTable('removeAll'); //清空表格数据 $('#my_table').bootst…