随笔- 63
文章- 0
评论- 76
阅读-
18万
随笔分类 - Bootstrap
Bootstrap <基础三十二>模态框(Modal)插件
摘要:模态框(Modal)是覆盖在父窗体上的子窗体。通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动。子窗体可提供信息、交互等。如果您想要单独引用该插件的功能,那么您需要引用modal.js。或者,正如Bootstrap 插件概览一章中所提到,您可以引用bootstrap.js...
阅读全文
Bootstrap <基础三十一>插件概览
摘要:在前面布局组件中所讨论到的组件仅仅是个开始。Bootstrap 自带 12 种 jQuery 插件,扩展了功能,可以给站点添加更多的互动。即使不是一名高级的 JavaScript 开发人员,也可以着手学习 Bootstrap 的 JavaScript 插件。利用 Bootstrap 数据 API(B...
阅读全文
Bootstrap <基础三十>Well
摘要:Well 是一种会引起内容凹陷显示或插图效果的容器 。为了创建 Well,只需要简单地把内容放在带有 class.well的 中即可。下面的实例演示了一个默认的 Well: Bootstrap 实例 - 默认的 Well 您好,我在 Well 中!结果如下所示:尺寸大小您可以...
阅读全文
Bootstrap <基础二十九>面板(Panels)
摘要:Bootstrap 面板(Panels)。面板组件用于把 DOM 组件插入到一个盒子中。创建一个基本的面板,只需要向 元素添加 class.panel和 class.panel-default即可,如下面的实例所示: Bootstrap 实例 - 默认的面板 ...
阅读全文
Bootstrap <基础二十八>列表组
摘要:列表组。列表组件用于以列表形式呈现复杂的和自定义的内容。创建一个基本的列表组的步骤如下:向元素 添加 class.list-group。向 添加 class.list-group-item。下面的实例演示了这点: Bootstrap 实例 - 基本的列表组 免费域名注册...
阅读全文
Bootstrap<基础二十七> 多媒体对象(Media Object)
摘要:Bootstrap 中的多媒体对象(Media Object)。这些抽象的对象样式用于创建各种类型的组件(比如:博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。媒体对象轻量标记、易于扩展的特性是通过向简单的标记应用 class ...
阅读全文
Bootstrap <基础二十六>进度条
摘要:Bootstrap 进度条。在本教程中,你将看到如何使用 Bootstrap 创建加载、重定向或动作状态的进度条。Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果。Internet Explorer 9 及之前的版本和旧版的 Firefox 不支持该特性,Opera 12 不支持动画...
阅读全文
Bootstrap <基础二十五>警告(Alerts)
摘要:警告(Alerts)以及 Bootstrap 所提供的用于警告的 class。警告(Alerts)向用户提供了一种定义消息样式的方式。它们为典型的用户操作提供了上下文信息反馈。您可以为警告框添加一个可选的关闭按钮。为了创建一个内联的可取消的警告框,请使用警告(Alerts) jQuery 插件。您可...
阅读全文
Bootstrap<基础二十四> 缩略图
摘要:Bootstrap 缩略图。大多数站点都需要在网格中布局图像、视频、文本等。Bootstrap 通过缩略图为此提供了一种简便的方式。使用 Bootstrap 创建缩略图的步骤如下:在图像周围添加带有 class.thumbnail的 标签。这会添加四个像素的内边距(padding)和一个灰色的边框...
阅读全文
Bootstrap <基础二十三>页面标题(Page Header)
摘要:页面标题(Page Header)是个不错的功能,它会在网页标题四周添加适当的间距。当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题这个功能就显得特别有用。如需使用页面标题(Page Header),请把你的标题放置在带有 class.page-header的 中: Boot...
阅读全文
Bootstrap <基础二十二>超大屏幕(Jumbotron)
摘要:Bootstrap 支持的另一个特性,超大屏幕(Jumbotron)。顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin)。使用超大屏幕(Jumbotron)的步骤如下:创建一个带有 class.jumbotron. 的容器 。除了更大的 ,字体粗细font-weigh...
阅读全文
Bootstrap <基础二十一>徽章(Badges)
摘要:Bootstrap 徽章(Badges)。徽章与标签相似,主要的区别在于徽章的边角更加圆滑。徽章(Badges)主要用于突出显示新的或未读的项。如需使用徽章,只需要把添加到链接、Bootstrap 导航等这些元素上即可。下面的实例演示了这点: Bootstrap 实例 - 徽章(Badges) ...
阅读全文
Bootstrap<基础二十> 标签
摘要:Bootstrap 标签。标签可用于计数、提示或页面上其他的标记显示。使用 class.label来显示标签,如下面的实例所示: Bootstrap 实例 - 标签 Example Heading LabelExample Heading LabelExample Heading...
阅读全文
Bootstrap <基础十九>分页
摘要:Bootstrap 支持的分页特性。分页(Pagination),是一种无序列表,Bootstrap 像处理其他界面元素一样处理分页。分页(Pagination)下表列出了 Bootstrap 提供的处理分页的 class。Class描述示例代码.pagination添加该 class 来在页面上显...
阅读全文
Bootstrap<基础十七>导航栏
摘要:导航栏是一个很好的功能,是 Bootstrap 网站的一个突出特点。导航栏在您的应用或网站中作为导航页头的响应式基础组件。导航栏在移动设备的视图中是折叠的,随着可用视口宽度的增加,导航栏也会水平展开。在 Bootstrap 导航栏的核心中,导航栏包括了站点名称和基本的导航定义样式。默认的导航栏创建一...
阅读全文
Bootstrap<基础十六> 导航元素
摘要:Bootstrap 提供的用于定义导航元素的一些选项。它们使用相同的标记和基类.nav。Bootstrap 也提供了一个用于共享标记和状态的帮助器类。改变修饰的 class,可以在不同的样式间进行切换。表格导航或标签创建一个标签式的导航菜单:以一个带有 class.nav的无序列表开始。添加 cla...
阅读全文
Bootstrap<基础十五> 输入框组
摘要:Bootstrap 支持的另一个特性,输入框组。输入框组扩展自表单控件。使用输入框组,可以很容易地向基于文本的输入框添加作为前缀和后缀的文本或按钮。通过向输入域添加前缀和后缀的内容,您可以向用户输入添加公共的元素。例如,可以添加美元符号,或者在 Twitter 用户名前添加 @,或者应用程序接口所需...
阅读全文
Bootstrap<基础十四> 按钮下拉菜单
摘要:使用 Bootstrap class 向按钮添加下拉菜单。如需向按钮添加下拉菜单,只需要简单地在在一个.btn-group中放置按钮和下拉菜单即可。也可以使用 来指示按钮作为下拉菜单。下面的实例演示了一个基本的简单的按钮下拉菜单: Bootstrap 实例 - 基本的按钮下拉菜单 ...
阅读全文
Bootstrap<基础十三> 按钮组
摘要:按钮组允许多个按钮被堆叠在同一行上。当你想要把按钮对齐在一起时,这就显得非常有用。你可以通过Bootstrap 按钮(Button) 插件添加可选的 JavaScript 单选框和复选框样式行为。下面的表格总结了 Bootstrap 提供的使用按钮组的一些重要的 class:Class描述代码示例....
阅读全文
Bootstrap <基础十二>下拉菜单(Dropdowns)
摘要:Bootstrap 下拉菜单。下拉菜单是可切换的,是以列表格式显示链接的上下文菜单。这可以通过与下拉菜单(Dropdown) JavaScript 插件的互动来实现。如需使用下列菜单,只需要在 class.dropdown内加上下拉菜单即可。下面的实例演示了基本的下拉菜单: Bootstrap ...
阅读全文