Bootstrap媒体对象

Bootstrap媒体对象

---

媒体对象默认样式

1.新建一个demo02.html文件，把demo01.html的头文件复制过来。

2.我们可以查看bootstrap中文网查看媒体对象默认样式的用法。

3.设置媒体对象默认样式

（首先给一个样式“media”，“media”表示里面我们要进行图文混排，然后“media-left”让它左对齐，接着设置“media-body”也就是媒体内容，设置一个标题，将标题样式设置为“media-heading”。

4.运行效果

5.设置右对齐

（将内容放在<p>标签里面。再加一个media块做“media-right”右对齐）

6.运行效果

7.垂直方向上居中对齐

8.运行效果

---

媒体列表

1.新建一个demo03.html。复制demo02.html里面media的内容。

2.设置媒体列表

（复制三个下面的内容）

3.运行效果

（这样的话就构成了一个列表）