Bootstrap

Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。目前,Bootstrap最新版本为3.0 。Bootstrap中文网致力于为广大国内开发者提供详尽的中文文档、代码实例等,助力开发者掌握并使用这一框架。

Bootstrap carousel轮转图的使用

来自:慕课网http://www.imooc.com/code/5395   图片轮播效果在Web中常常能看到,很多人也称之为幻灯片。其主要显示的效果就是多幅图片轮回播放, 从右向左播放,鼠标悬停在图片时会暂停播放,如果鼠标悬停或单击右下角圆点时,会显示对应的图片。 这种图片轮播效果,在Bootstrap框架中是通过Carousel

2015-08-07 10:13:10

【细解】如何基于bootstrap创建一个响应式的导航条

本地下载 最终实现效果如下:   首先你得引入bootstrap与jquery 推荐一个CDN:http://cdn.gbtags.com/index.html 然后就是开始编写HTML代码.如果你不想更改显示效果的话实际上CSS都免去写了2333 因为HTML代码比较多 这里分为三个部分 然后最后再上一份整体HTM

2015-08-07 10:13:09

Bootstrap 3支持IE 8遇到的一个小问题

使用Bootstrap完成web的UI后,在IE 8运行时,发现.container等class的标签的的宽度并没按预期的宽度显示,本人已经根据bootstrap官方说明 http://getbootstrap.com/getting-started/#support,增加引入repond.js,   <meta chars

2015-08-07 10:13:07

jquery cleditor 光标经常点不进去问题解决方法 bootstrap 富文本框 控件

cleditor 光标点不进去,原因是内嵌的html代码段 body没有赋值默认高度。 解决方法1.赋值options.bodyStyle  设置min-height值。缺点:不能跟随设备更新最低高度。 2.源码代码段850行 \'<body + options.bodyStyle + \'\"></body&g

2015-08-07 10:13:06

table超过30个字段如何处理呢? bootstrap

样式: @media (max-width: 768px) { .table-supplier { width: 100%; height: 100%; margin-bottom: 12.75px; overflow-y: hidden; overflow-x: scroll; -ms-overflow-style:

2015-08-07 10:13:06

bootstrap基本CSS Class

栅格系统: container container-fluid row 行 col-md-* 列 col-md-offset-* 已左边为基准向右偏移 列表: list-unstyled 无列表样式 list-inline 行内列表 dl-horizontal 自定义列表水平排列(dt和dd的内容在同一行) 表格: table

2015-08-07 10:13:04

bootstrap媒体查询常用写法

@media (max-width: 768px) { /*超小屏幕设备 手机*/ } @media (min-width: 768px) and (max-width: 992px) { /*小屏幕设备 平板*/ } @media (min-width: 992px) and (max-width: 1200px)

2015-08-07 10:13:03

Bootstrap css背景图片的设置

一、 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加     居中方法:水平居中的text-align:center 和 margin:0 auto极客学院例子http://www.jikexueyuan.com/course/656_3.htm

2015-08-07 10:13:03

bootstrap中的动态加载出来的图片轮播中的li标签中的class="active"的动态添加移除

//该方法是在slide改变时立即触发该事件, $(\'#myCarousel\').on(\'slide.bs.carousel\', function () { $(\"#myCarousel ol li\").toggleClass(\"active\");//重复切换类名“active” }); 遇到的问

2015-08-07 10:13:03

bootstrap的alert提示框的关闭后再显示问题

bootstrap中有alert组件,如果点击关闭按钮后该组件会被删除而不是被隐藏,想再显示怎么办呢? bootstrap-alert.js源码片段: function removeElement() {         $parent    &nb

2015-08-07 10:13:01

最近玩Bootstrap , 一些小工具 记录在案。

最近玩Bootstrap , 一些小工具 记录在案。 1 定制Bootstrap ,所见即所得的修改Bootstrap的各种变量,即时查看样式的变化。 http://bootswatchr.com/ http://pikock.github.io/bootstrap-magic/   2 很多实用的html,js,css 代码() ht

2015-08-07 10:13:00

bootstrap 轮播图效果 图片延迟加载

bootstrap 框架可以从以下几个方面进行优化处理 1 使用更好的方法加载拟态窗口,通过写php脚本查询数据,填充到拟态窗口中,实现数据的预加载。 2 更好的设计代码结构 尽量不依赖额外的库来操作拟态窗口,尽量的减少请求,减少带宽的使用。 3 bootstrap大轮播图的图片延迟加载的解决方案 代码: function lazyContaine

2015-08-07 10:12:58

Bootstrap (导航、标签、面包屑导航)

2015-08-07 10:12:58

bootstrap之辅助类

  类 描述 .pull-left 元素浮动到左边 .pull-right 元素浮动到右边 .center-block 设置元素为 display:block 并居中显示 .clearfix 清除浮动 .show 强制元素显示 .hidden 强制元素隐

2015-08-07 10:12:57

解决Bootstrap模态框切换时页面抖动 or页面滚动条

Bootstrap为了让所有的页面(这里指内容溢出和不溢出)显示效果一样,采取的方法如下: 当Modal显示时,设置body -- overflow:hidden;margin-right:15px;(设置15px是因为浏览器的滚动条占位是15px);(通过在modal显示时给body添加.modal-open类实现)         设置modal -

2015-08-07 10:12:56

BootStrap Progressbar 实现大文件上传的进度条

1.首先实现大文件上传,如果是几兆或者几十兆的文件就用基本的上传方式就可以了,但是如果是大文件上传的话最好是用分片上传的方式。我这里主要是使用在客户端进行分片读取到服务器段,然后保存,到了服务器段读取完了之后将分片数据进行组合。 2.前端代码如下: <%@ Page Language=\"C#\" AutoEventWireup=\"tru

2015-08-07 10:12:52

bootstrap之

一、字体图标 <button type=\"button\" > <span ></span> User </button>   <span ></span> <ul > <li ><a

2015-08-07 10:12:51

bootstrap 移动自适应界面

移动设备优先 在 Bootstrap 2 中,我们对框架中的某些关键部分增加了对移动设备友好的样式。而在 Bootstrap 3 中,我们重写了整个框架,使其一开始就是对移动设备友好的。这次不是简单的增加一些可选的针对移动设备的样式,而是直接融合进了框架的内核中。也就是说,Bootstrap 是移动设备优先的。针对移动设备的样式融合进了框架的每个角落,而不

2015-08-07 10:12:50

Bootstrap 响应式设计

本教程讲解如何在网页布局中应用响应式设计。在课程中,您将学到响应式 Web 设计。随着移动设备的普及,如何让用户通过移动设备浏览您的网站获得良好的视觉效果,已经是一个不可避免的问题了。响应式 Web 设计就是为实现这个目的的有效方法。 什么是响应式 Web 设计 响应式 Web 设计是一个让用户通过各种尺寸的设备浏览网站获得良好的视觉效果的方法。例如,您

2015-08-07 10:12:50

bootstrap框架以及css一些常见问题

 这周学习了Bootstrap框架、flatUl框架还有快切框架,框架很好的简化了我们程序员的代码量,同时也可以让我们更丰富利用已经写好的各种css和js样式,能简单、快速、解决兼容性问题让我们有更多精力放在web前端开发上; bootstrap首先提供了一个布局框架,叫 960栅格式布局,其布局格式如下:   &nb

2015-08-07 10:12:49