Bootstrap3

屏幕阅读器

Bootstrap 辅助类

Bootstrap 辅助类 本章将讨论 Bootstrap 中的一些可能会派上用场的辅助类。 文本 以下不同的类展示了不同的文本颜色。如果文本是个链接鼠标移动到文本上会变暗: 类 描述 实例 .text-muted “text-muted” 类的文本样式 .text-primary “text-primary” 类的文本样式 .text-succes... »

警告(Alerts)中的链接

Bootstrap 警告(Alerts)

Bootstrap 警告(Alerts) 本章将讲解警告(Alerts)以及 Bootstrap 所提供的用于警告的 class。警告(Alerts)向用户提供了一种定义消息样式的方式。它们为典型的用户操作提供了上下文信息反馈。 您可以为警告框添加一个可选的关闭按钮。为了创建一个内联的可取消的警告框,请使用 结果如下所示: 可取消的警告(Dismissal Alerts) 创建一个可取消的警告(D... »

按钮(Button)插件方法

Bootstrap 按钮(Button)插件

Bootstrap 按钮(Button)插件 按钮(Button)在 结果如下所示: 单个切换 如需激活单个按钮的切换(即改变按钮的正常状态为按压状态,反之亦然),只需向 button 元素添加 data-toggle=”button” 作为其属性即可,如下面实例所示: 实例 单个切换 结果如下所示: 复选框(Checkbox) 您可以创建复选框组,并通过向 btn-gro... »

响应式实用工具

Bootstrap 响应式实用工具

Bootstrap 响应式实用工具Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发。响应式实用工具目前只适用于块和表切换。调整浏览器的窗口大小,或者在不同的设备上加载实例,测试响应式实用工具类。 »

堆叠的进度条

Bootstrap 进度条

Bootstrap 进度条 本章将讲解 Bootstrap 进度条。在本教程中,您将看到如何使用 Bootstrap 创建加载、重定向或动作状态的进度条。 Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果。Internet Explorer 9 及之前的版本和旧版的 Firefox 不支持该特性,Opera 12 不支持动画。 默认的进度条 创建一个基本的进度条的步骤如下: 添加一... »

折叠(Collapse)插件事件

Bootstrap 折叠(Collapse)插件

Bootstrap 折叠(Collapse)插件 折叠(Collapse)插件可以很容易地让页面区域折叠起来。无论您用它来创建折叠导航还是内容面板,它都允许很多内容选项。 如果您想要单独引用该插件的功能,那么您需要引用 collapse.js。同时,也需要在您的 Bootstrap 版本中引用 结果如下所示: data-toggle=”collapse” 添加到您想要展开或... »

如何使用字体图标

Bootstrap 字体图标(Glyphicons)

Bootstrap 字体图标(Glyphicons) @font-face { font-family:’Glyphicons Halflings’;src:url(https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.eot);src:url(//maxcdn.... »

Bootstrap 多媒体对象(Media Object)

Bootstrap 多媒体对象(Media Object)

Bootstrap 多媒体对象本章我们将讲解 Bootstrap 中的多媒体对象,如:图像、视频、音频等。使用 .media-left 类让多媒体对象(图片)来实现左对齐,同样 .media-right 类实现了右对齐。实例 RUNOOB-1 Posted on February 19, 2016 这是一些示例文本。RUNOOB-4 Posted on Februa... »

轮播(Carousel)插件事件

Bootstrap 轮播(Carousel)插件

Bootstrap 轮播(Carousel)插件 Bootstrap 轮播(Carousel)插件是一种灵活的响应式的向站点添加滑块的方式。除此之外,内容也是足够灵活的,可以是图像、内嵌框架、视频或者其他您想要放置的任何类型的内容。 如果您想要单独引用该插件的功能,那么您需要引用 carousel.js。或者,正如 结果如下所示: 可选的标题 您可以通过 .item 内的 .carousel-ca... »

下拉菜单标题

Bootstrap 下拉菜单(Dropdowns)

Bootstrap 下拉菜单本章将重点介绍 Bootstrap 下拉菜单。下拉菜单是可切换的,是以列表格式显示链接的上下文菜单。这可以通过与 结果如下所示:选项对齐通过向 .dropdown-menu 添加 class .pull-right 来向右对齐下拉菜单。 »

列表组中的自定义内容

Bootstrap 列表组

Bootstrap 列表组 本章我们将讲解列表组。列表组件用于以列表形式呈现复杂的和自定义的内容。创建一个基本的列表组的步骤如下: 向元素 添加 class .list-group。 向 添加 class .list-group-item。 下面的实例演示了这点: 实例 免费域名注册 免费 Window 空间托管 图像的数量 24*7 支持 每年更新成本 结果如下所示: 向列表组添加徽章 我们可以... »

Bootstrap 附加导航(Affix)插件

Bootstrap 附加导航(Affix)插件

Bootstrap 附加导航(Affix)插件 附加导航(Affix)插件允许指定 固定在页面的某个位置。一个常见的例子是社交图标。它们将在某个位置开始,但当页面点击某个标记,该 会锁定在某个位置,不会随着页面其他部分一起滚动。 如果您想要单独引用该插件的功能,那么您需要引用 affix.js。或者,正如 Bootstrap 插件概览 一章中所提到,您可以引用 bootstrap.js 或压缩版的... »

垂直的按钮组

Bootstrap 按钮组

Bootstrap 按钮组按钮组允许多个按钮被堆叠在同一行上。实例 按钮 1 按钮 2 下拉 下拉链接 1 下拉链接 2 结果如下所示:垂直的按钮组下面的实例演示了上面表格中讨论到的 class .btn-group-vertical 的使用: 实例 按钮 1 按钮 ... »

带列表组的面板

Bootstrap 面板(Panels)

Bootstrap 面板本章将讲解 Bootstrap 面板。创建一个基本的面板,只需要向 元素添加 class .panel 和 class .panel-default 即可,如下面的实例所示:实例 这是一个基本的面板 结果如下所示:面板标题我们可以通过以下两种方式来添加面板标题:使用 .panel-heading class 可以很简单地向面板添加标题容器。使用... »

22215744_BxJa

Bootstrap UI 编辑器

Bootstrap UI 编辑器以下是 15 款最好的 Bootstrap 编辑器或者是在线编辑工具。更神奇的是,Bootstrap 会根据用户的每个选择来重新建立框架,方便用户的下载和使用。拥有拖拽接口的功能,能简单迅速的构建一个 Bootstrap 前端代码。她提供本地的 Bootstrap,jQuery UI 或者是纯 jQuery 编辑功能。此 Bootstrap UI 编辑器拥有许多很强... »

Bootstrap 教程

Bootstrap 教程

Bootstrap 教程Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。教程被分为 Bootstrap 基本结构、Bootstrap CSS、Bootstrap 布局组件和 Bootstrap 插件几个部分。Bootstrap 可视化布局系统!在您学习完本教程后,您即... »

按钮上拉菜单

Bootstrap 按钮下拉菜单

Bootstrap 按钮下拉菜单本章将讲解如何使用 Bootstrap class 向按钮添加下拉菜单。如需向按钮添加下拉菜单,只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可。分割按钮的左边是原始的功能,右边是显示下拉菜单的切换。 »

Well 的尺寸大小

Bootstrap Well

Bootstrap WellWell 是一种会引起内容凹陷显示或插图效果的容器 。为了创建 Well,只需要简单地把内容放在带有 class .well 的 中即可。下面的实例演示了一个默认的 Well:实例您好,我在 Well 中!这两个类是与 .well 类结合使用的。您好,我在小的 Well 中! »

Bootstrap v2 教程

Bootstrap v2 教程Bootstrap,来自 Twitter,是基于 HTML、CSS、JAVASCRIPT 的简介灵活的流行前段框架及交互组件集。现在开始学习 Bootstrap! »

Bootstrap 简介

Bootstrap 简介 什么是 Bootstrap? Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。 历史 Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。 为什... »

输入框组中分割的下拉菜单按钮

Bootstrap 输入框组

Bootstrap 输入框组本章将讲解 Bootstrap 支持的另一个特性,输入框组。输入框组扩展自 结果如下所示:输入框组的大小您可以通过向 .input-group 添加相对表单大小的 class来改变输入框组的大小。输入框中的内容会自动调整大小。 »

Bootstrap 创建一个网页

Bootstrap 创建一个网页接下来我们通过 Bootstrap3 来创建一个简单的响应式网页。在学习之前我们可以先看下效果: »

Bootstrap HTML编码规范

Bootstrap HTML编码规范 code { font-family: “PT Mono”, Menlo, “Courier New”, monospace; padding: 2px 4px; font-size: 85%; color: #d44950; background-color: #f7f7f9; border-radius: .... »

Bootstrap 环境安装

Bootstrap 环境安装Bootstrap 安装是非常容易的。本章将讲解如何下载并安装 Bootstrap,讨论 Bootstrap 文件结构,并通过一个实例演示它的用法。下载 Bootstrap您可以从 Staticfile CDN 推荐国内推荐使用 Staticfile CDN 上的库: 此外,你还可以使用以下的 CDN 服务:国际推荐使用:https://cdnjs.com/ »

带有下拉菜单的胶囊

Bootstrap 导航元素

Bootstrap 导航元素 本章我们将讲解 Bootstrap 提供的用于定义导航元素的一些选项。它们使用相同的标记和基类 .nav。Bootstrap 也提供了一个用于共享标记和状态的帮助器类。改变修饰的 class,可以在不同的样式间进行切换。 表格导航或标签 创建一个标签式的导航菜单: 以一个带有 class .nav 的无序列表开始。 添加 class .nav-tabs。 下面的实例演... »

Page 1 of 3123