如何在文章中加入图片

被Machi蚂蚁问到这个问题，想必然会有其他蚂蚁面对这个问题，所以写成Q&A放在这里，方便大家查询。

在文章中加入图片有两种形式：上载图片或链接图片。

上载图片是通过蚂蚁的后台程序在撰写文章时上传的附件。可以直接通过上传附件旁的按键快捷加入。要注意的是所上传的图片是直接针对当前文章存在的，换句话说你在文章A上传的文件，只能在文章A快捷引用，如果要在其他文章中共用，别的文章中就需要使用链接图片的方式呈现了。

上传图片的方式在操作手册（文章->撰写文章）中已经有简单的介绍，其实这非常直观、简单使用，自己实习一下就知道哪个按键是做什么用的了。

链接图片，简单的说就是直接使用HTML Code显示你所要的图片，这不管是在文章中或模板中都可以运用。这些图片的“物理位置”可以是储存在蚂蚁的网址以外（如Fliker或Picasa），或者是蚂蚁的网址中（举上面的例子就是了）。下面是一个简单的例子，如何在文章中加入链接图片：（使用Firefox做示范）

例子：我要把蚂蚁的部落图案放在我的文章中。

[#M_1. 首先我要从蚂蚁部落中找出这个部落图案的网络位置。|less..|     
      

       
        如何找出图片网络位置：
        a.  把鼠标移到红色圈子的位置上。
        b.  按下滑鼠右键。
        c.   选择 Copy Image Location.
_M#]
[#M_2. 再来进入源码编译模式。|less..|按下EDIT这个按键就行了。看下图。
你会发现撰写区由形象撰写模式变成了源码撰写模式，如下图就是了：
_M#]
[#M_3. 最后加入编码。|less..| 加入图片链接的编码是：
<img src=”图片网络地址” style=”width:500px;” />

其中style=”xxx”这个部份可以选择不要。主要是用于指定图片的呈现方法。如果你的图片宽度大于你的模板文章显示宽度，说你的模板只有500px的显示宽度，那就需要用style来指定宽度了。指定宽度后，图片的高度会自动跟着改变，所以不会变形。

在这例子中，图片网络地址是：http://www.antzblog.com/link_image/AntzBlogLogo1.jpg

所以图片链接编码将会变成：（由于图片的宽度只有150px所以不必指定宽度。）
<img src=”http://www.antzblog.com/link_image/AntzBlogLogo1.jpg” />

如果我要把图片显示在50px的宽度内，可以把编码改成：
<img src=”http://www.antzblog.com/link_image/AntzBlogLogo1.jpg” style=”width:50px;” />

_M#]