多媒体对象（Media Object），如：图像、视频、音频等。多媒体对象的样式可用于创建各种类型的组件（比如：博客评论），我们可以在组件中使用图文混排，图像可以左对齐或者右对齐。媒体对象可以用更少的代码来实现媒体对象与文字的混排。工具/原料moreBootstrap插件HBuilder XJQuery插件方法/步骤1/7分步阅读

打开编译器HBuilderX，鼠标右键，新建项目。。

2/7

在项目中的js中打开index.html。

3/7

在头部标签中引入JQuery插件，如图所示：

4/7

在身体部分引入Bootstrap插件，如图所示：

5/7

身体部分的代码：

div class=media

div class=media-left

img src=../img/3.jpeg class=media-object style=width:160px;height:100px;

/div

div class=media-body

!-- 指定头部信息：media-heading --

h4 class=media-heading左对齐(标题部分)/h4

p内容简介部分/div

/div

6/7

在游览器中运行结果如下：

7/7

图中小编又加了一个右对齐的方式，所以看到的是两个。

右对齐是将属性改为media-right即可，但是要注意，代码从上往下执行，所以图片要放在文字描述之后。

注意事项

代码规范。

JQUERYBOOTSTRAP代码媒体对象