用相框图片作背景的代码
<CENTER>
<DIV style="WIDTH:宽度px">
<table align="center" width="宽度" height="高度"
cellspacing="0" cellpadding="0" border="0"
style="background-repeat:no-repeat;"
background="图片地址">
<tbody>
<tr>
<td valign="top" style="padding-top:50px;padding-right:30px;padding-left:30px;
line-height:1.5em;font-size:14pt;color:#cccccc;font-weight:normal;font-family:宋体;">
<p align="left" style="margin:0;text-indent:2em;">文字写在这里，每段文字的首行已缩进两字。</p>
<p align="left" style="margin:0;text-indent:2em;">文字写在这里</p>
</td>
</tr>
</tbody>
</table>
</DIV >
</CENTER>
为了解释方便，将上述代码分成三部分。
第一段是定义一个表格。取相框图片作背景图，需要更改的是：
宽度（width）
高度(height）
及图片的地址
注意：宽度和高度必须与原图的实际大小一致，不得加大或缩小。此代码只适用于背景图片宽度小于800，如果宽度大于800，代码div的设定不一样。
第二段是文字区域位置的设置。我们将文字区域理解为一个方型的区域（在源代码里称为容器），它位于图片内部。需要设置的是方形区域与背景图片上、左、右三边的距离。
valign="top" 文字区域与背景图向上对齐。这设置很重要，使下面的竖向定位有一个基准。原来的默认值是居中的，因此难以控制文字区域的竖向位置。
padding-top:370px;padding-right:30px;padding-left:30px;
在style里padding设置是文字区域在背景图上的位置。在源代码里称为“填充距”，它与背景图的关系请看上面的示图。padding-top 是“上填充距”，即文字区域离图片顶边的距离。根据不同图片设定调整，padding-right 是右填充距，padding-left是左填充距。设置左右填充距的目的，是使文字区域在左右两边都留空，数值从20px~50px随意,左右可以不对称。现在的数据 只作参考。下填充距可以不设置。当背景图上有边图时，就要按需设置左右两个填充距的数值，以避开它。要反复试多次，才能完美。
valign的设置是必须的，padding的设置也可以用空格或空行来代替。
下面一行代码是文字的大小、颜色、字体等的设置， line-height：1.5em 这里的值 1.5em 是指行高等于1个半文字的高度。
p标签里的 text-indent: 2em 设置了每段首行都缩进两个字的距离。这样可以不用打空格来调整首行的缩进量了。
代码的第三部分是表格的封闭标签。
[
本帖最後由 rainbow 於 2018-1-28 00:01 編輯 ]
