上海网站建设?上海网站设计（www.paiky.net）

一个<img>标签的ALT属性，为无法下载图像或图像完全关闭用户，提供了替代的内容。我们一直使用这个属性，使我们的内容更容易访问，但你可曾想过它实际上看起来像吗？

我们将要使用的电子邮件作为讲解案例。

<img?src="images/h1.gif"?alt="Creating?Email?Magic"?width="300"?height="230"?style="display:?block;"?/>

如果我们来看看在我们的文件里的图像，可能是下面这个样子：

显然ALT文本是没有吸引力的?-?特别是链接。?我们可以做几件事情来改变也一下。

主标题，我们打算使文字更大，将其更改为深蓝色，而不是黑色。我们将通过添加一些样式来实现它。

这是我们的原始代码：

<td?align="center"?bgcolor="#70bbd9"?style="padding:?40px?0?30px?0;">

<img?src="images/h1.gif"?alt="Creating?Email?Magic"?width="300"?height="230"?style="display:?block;"?/>

</td>

我们将添加一些文本样式，所以它看起来像这样：

<td?align="center"?bgcolor="#70bbd9"?style="padding:?40px?0?30px?0;?color:?#153643;?font-size:?28px;?font-weight:?bold;?font-family:?Arial,?sans-serif;">

<img?src="images/h1.gif"?alt="Creating?Email?Magic"?width="300"?height="230"?style="display:?block;"?/>

</td>

为了整体风格统一，社会媒体的连接，使它们成为白色：

<table?border="0"?cellpadding="0"?cellspacing="0">

<tr>

<td?style="font-family:?Arial,?sans-serif;?font-size:?12px;?font-weight:?bold;">

<a?href="http://www.twitter.com/"?style="color:?#ffffff;">

<img?src="images/tw.gif"?alt="Twitter"?width="38"?height="38"?style="display:?block;"?border="0"?/>

</a>

</td>

<td?style="font-size:?0;?line-height:?0;"?width="20">?</td>

<td?style="font-family:?Arial,?sans-serif;?font-size:?12px;?font-weight:?bold;">

<a?href="http://www.twitter.com/"?style="color:?#ffffff;">

<img?src="images/fb.gif"?alt="Facebook"?width="38"?height="38"?style="display:?block;"?border="0"?/>

</a>

</td>

</tr>

</table>

就这么简单！?现在，我们可以相信，我们的电子邮件，即使关闭图像显示效果也很好。