您好,欢迎访问一九零五行业门户网

BootStrap学习(5)_多媒体对象&列表组_html/css_WEB-ITnose

一、多媒体对象 这些抽象的对象样式用于创建各种类型的组件(比如:博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。
.media:该 class 允许将媒体对象里的多媒体(图像、视频、音频)浮动到内容区块的左边或者右边。 .media-list:如果你需要一个列表,各项内容是无序列表的一部分,可以使用该 class。可用于评论列表与文章列表。 1.基本多媒体对象
企鹅-标题 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。
企鹅 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。 这是一个企鹅。这是一个企鹅。

效果:
2.嵌套的媒体对象
用户1 今天的天气真好,空气清新,阳光明媚。 用户1: 是啊,天气真好。
企鹅3: 嗯嗯,是的呢。

效果:
二、列表组 列表组件用于以列表形式呈现复杂的和自定义的内容
向元素 添加 class .list-group。 向 添加 class .list-group-item。 可以向任意的列表项添加徽章组件,它会自动定位到右边。只需要在 元素中添加 即可 1.基本列表组
新新闻1 荐新闻2 新闻3 新闻4
效果:
2.向列表组添加链接
新新闻1 荐新闻2 新闻3 新闻4
效果:
3.自定义内容
新闻 新闻1 新闻内容新闻内容新闻内容新闻内容新闻内容......
新闻2 新闻2内容新闻2内容新闻2内容新闻2内容......

效果:
其它类似信息

推荐信息