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