摘要：
弹窗 一. 结构分析 Bootstrap框架中的模态弹出框，分别运用了“modal”、“modal-dialog”和“modal-content”样式，而弹出窗真正的内容都放置在“modal-content”中，其主要又包括三个部分： ☑ 弹出框头部，一般使用“modal-header”表示，主要包 阅读全文
摘要：
一、基础面板 基础面板非常简单，就是一个div容器运用了“panel”样式，产生一个具有边框的文本显示块。 由于“panel”不控制主题颜色，所以在“panel”的基础上增加一个控制颜色的主题“panel-default”，另外在里面添加了一个“div.panel-body”来放置面板主体内容。 二 阅读全文
摘要：
一、基本列表组 列表组是Bootstrap框架新增的一个组件，可以用来制作列表清单、垂直导航等效果，也可以配合其他的组件制作出更漂亮的组件。 二、链接列表组 三、自定义列表组 Bootstrap框加在链接列表组的基础上新增了两个样式： ☑ list-group-item-heading：用来定义列表 阅读全文
摘要：
一、基本媒体对象 媒体对象一般是成组出现，而一组媒体对象常常包括以下几个部分： ☑ 媒体对像的容器：常使用“media”类名表示，用来容纳媒体对象的所有内容 ☑ 媒体对像的对象：常使用“media-object”表示，就是媒体对象中的对象，常常是图片 ☑ 媒体对象的主体：常使用“media-body 阅读全文
摘要：
40% 40% 40% 40% 40% 40% 40% 20% 20% 20% 20% 20% 阅读全文
摘要：
缩略图在网站中最常用的地方就是产品列表页面，一行显示几张图片，有的在图片底下（左侧或右侧）带有标题、描述等信息。 Bootstrap框架将这一部独立成一个模块组件。并通过“thumbnail”样式配合bootstrap的网格系统来实现。可以将产品列表页变得更好看。 在宽屏幕（可视区域大于768px） 阅读全文
摘要：
一、默认警示框 Bootstrap框架通过“alert“样式来实现警示框效果。在默认情况之下，提供了四种不同的警示框效果： 1、成功警示框：告诉用用户操作成功，在“alert”样式基础上追加“alert-success”样式，具体呈现的是背景、边框和文本都是绿色； 2、信息警示框：给用户提供提示信息 阅读全文
摘要：
一、标签 在一些Web页面中常常会添加一个标签用来告诉用户一些额外的信息，比如说在导航上添加了一个新导航项，可能就会加一个“new”标签，来告诉用户。 那么在Bootstrap框架中特意将这样的效果提取出来成为一个标签组件，并且以“.label”样式来实现高亮显示。 颜色样式设置： 和按钮元素but 阅读全文
摘要：
一、带页码的分页导航 二、翻页分页导航 对齐样式设置： 默认情况之下，翻页分页导航是居中显示，但有的时候我们需要一个居左，一个居右。Bootstrap框架提供了两个样式： ☑ previous：让“上一步”按钮居左 ☑ next：让“下一步”按钮居右 具体使用的时候，只需要在li标签上添加对应类名即 阅读全文
摘要：
一、基础导航条 在制作一个基础导航条时，主要分以下几步： 第一步：首先在制作导航的列表(<ul class=”nav”>)基础上添加类名“navbar-nav” 第二步：在列表外部添加一个容器（div），并且使用类名“navbar”和“navbar-default” 1、在Web页面制作中，常常在菜 阅读全文
摘要：
一、标签形tab导航 标签形导航，也称为选项卡导航。 标签形导航是通过“.nav-tabs”样式来实现。在制作标签形导航时需要在原导航“.nav”上追加此类名。 我们想让“Home”项为当前选中项，只需要在其标签上添加类名".active”即可。 选项卡还带有禁用状态，只需要在标签项上添加".dis 阅读全文
摘要：
单个按钮在Web页面中的运用有时候并不能满足我们的业务需求，常常会看到将多个按钮组合在一起使用，比如富文本编辑器里的一组小图标按钮等。 Bootstrap框架为大家提供了按钮组组件。 1、对于结构方面，非常的简单。使用一个名为“.btn-group”的容器，把多个按钮放到这个容器中（按钮组）。 除了 阅读全文
摘要：
在使用Bootstrap框架的下拉菜单时，必须调用Bootstrap框架提供的bootstrap.js文件。 一、普通下拉菜单 1、使用一个名为“dropdown”的容器包裹了整个下拉菜单元素，示例中为: 2、使用了一个<button>按钮做为父菜单，并且定义类名“.dropdown-toggle” 阅读全文