bootstrap_开始 - 相关文章

【bootstrap_开始】的更多相关文章

Bootstrap_面板

一.基础面板基础面板非常简单,就是一个div容器运用了“panel”样式,产生一个具有边框的文本显示块. 由于“panel”不控制主题颜色,所以在“panel”的基础上增加一个控制颜色的主题“panel-default”,另外在里面添加了一个“div.panel-body”来放置面板主体内容. <div class="panel panel-default"> <div class="panel-body">我是一个基础面板,带有默认主题样…

Bootstrap_列表组

一.基本列表组列表组是Bootstrap框架新增的一个组件,可以用来制作列表清单.垂直导航等效果,也可以配合其他的组件制作出更漂亮的组件. <ul class="list-group"> <li class="list-group-item"> <span </span>揭开CSS3的面 </li> <li class="list-group-item"> <span &…

Bootstrap_媒体对象

一.基本媒体对象媒体对象一般是成组出现,而一组媒体对象常常包括以下几个部分: ☑ 媒体对像的容器:常使用“media”类名表示,用来容纳媒体对象的所有内容 ☑ 媒体对像的对象:常使用“media-object”表示,就是媒体对象中的对象,常常是图片 ☑ 媒体对象的主体:常使用“media-body”表示,就是媒体对像中的主体内容,可以是任何元素,常常是图片侧边内容 ☑ 媒体对象的标题:常使用“media-heading”表示,就是用来描述对象的一个标题,此部分可选除了上面四个部分之外,在Bo…

Bootstrap_缩略图

缩略图在网站中最常用的地方就是产品列表页面,一行显示几张图片,有的在图片底下(左侧或右侧)带有标题.描述等信息. Bootstrap框架将这一部独立成一个模块组件.并通过“thumbnail”样式配合bootstrap的网格系统来实现.可以将产品列表页变得更好看. <div class="container"> <div class="row"> <div class="col-xs-6 col-md-3">…

Bootstrap_让Bootstrap轮播插件carousel支持左右滑动手势的三种方法

Bootstrap 的 carousel.js 插件并没有支持手势. 3种解决方案 : jQuery Mobile (http://jquerymobile.com/download/) $("#carousel-generic").swipeleft(function() { $(this).carousel('next'); }); $("#carousel-generic").swiperight(function() { $(this).carousel('…

Bootstrap_进度条

<div class="progress"> <div %</div> </div>  <div class="progress"> <div %</div> </div> <div class="progress"> <div %</div> </div…

Bootstrap_警示框

一.默认警示框 Bootstrap框架通过“alert“样式来实现警示框效果.在默认情况之下,提供了四种不同的警示框效果: 1.成功警示框:告诉用用户操作成功,在“alert”样式基础上追加“alert-success”样式,具体呈现的是背景.边框和文本都是绿色: 2.信息警示框:给用户提供提示信息,在“alert”样式基础上追加“alert-info”样式,具体呈现的是背景.边框和文本都是浅蓝色: 3.警告警示框:提示用户小心操作(提供警告信息),在“alert”样式基础上追加“alert-w…