BootStrap学习(5)_多媒体对象&列表组_html/css
来源：动视网
责编：小采
时间：2020-11-27 16:14:17
BootStrap学习(5)_多媒体对象&列表组_html/css
BootStrap学习(5)_多媒体对象&列表组_html/css_WEB-ITnose:一、多媒体对象 这些抽象的对象样式用于创建各种类型的组件（比如：博客评论），我们可以在组件中使用图文混排，图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。 .media：该 class 允许将媒体对象里的多媒体（图像、视频、
导读BootStrap学习(5)_多媒体对象&列表组_html/css_WEB-ITnose:一、多媒体对象 这些抽象的对象样式用于创建各种类型的组件（比如：博客评论），我们可以在组件中使用图文混排，图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。 .media：该 class 允许将媒体对象里的多媒体（图像、视频、
一、多媒体对象
这些抽象的对象样式用于创建各种类型的组件（比如：博客评论），我们可以在组件中使用图文混排，图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。
.media：该 class 允许将媒体对象里的多媒体（图像、视频、音频）浮动到内容区块的左边或者右边。 .media-list：如果你需要一个列表，各项内容是无序列表的一部分，可以使用该 class。可用于评论列表与文章列表。 1.基本多媒体对象
效果:
2.嵌套的媒体对象
效果:
二、列表组
列表组件用于以列表形式呈现复杂的和自定义的内容
向元素 添加 class .list-group。 向 添加 class .list-group-item。 可以向任意的列表项添加徽章组件，它会自动定位到右边。只需要在 元素中添加 即可 1.基本列表组
效果:
2.向列表组添加链接
效果:
3.自定义内容
效果:
BootStrap学习(5)_多媒体对象&列表组_html/css
BootStrap学习(5)_多媒体对象&列表组_html/css_WEB-ITnose:一、多媒体对象 这些抽象的对象样式用于创建各种类型的组件（比如：博客评论），我们可以在组件中使用图文混排，图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。 .media：该 class 允许将媒体对象里的多媒体（图像、视频、
