学习周记10

本周学习了Bootstrap 图片、Bootstrap 布局组件等实用内容。

Bootstrap 图片

在本个项目中，我们学习了 Bootstrap 对图片的支持。Bootstrap 提供了三个可对图片应用简单样式的 class：

.img-rounded：添加 border-radius:6px 来获得图片圆角。
.img-circle：添加 border-radius:50% 来让整个图片变成圆形。
.img-thumbnail：添加一些内边距（padding）和一个灰色的边框。
实例及运行结果：

< img > 类

以下类可用于任何图片中。

.img-rounded 【为图片添加圆角 (IE8 不支持) 尝试一下】
.img-circle 【将图片变为圆形 (IE8 不支持) 尝试一下】
.img-thumbnail 【缩略图功能 尝试一下】
.img-responsive 【图片响应式 (将很好地扩展到父元素)】

Bootstrap 面包屑导航

面包屑导航是一种基于网站层次信息的显示方式。以博客为例，面包屑导航可以显示发布日期、类别或标签。它们表示当前页面在导航层次结构内的位置。

Bootstrap 分页

结果：

Bootstrap 警告框（Alert）插件

警告框（Alert）消息大多是用来向终端用户显示诸如警告或确认消息的信息。使用警告框（Alert）插件，您可以向所有的警告框消息添加可取消（dismiss）功能。

简易警告框设计及结果：