0

我有像边框一样围绕文本的图像。所以上一图，左一图，右一图，下图。当文本很短时很好，但是当我插入比左右图像的高度更长的文本时，它不再是边框了。我把它都放在一张桌子上。我的代码：

<table cellspacing="0" cellpadding="0" style="width: 640px;">
   <tr>
      <td colspan="3"><img src=srctop.png /></td>
   </tr>
   <tr>
      <td>
         <img src=srcleft.png />
      </td>
      <td valign="top">
         <p>Lorem ipsum</p>
      </td>
      <td>
         <img align="right" src=srcright.png style="height:675px;"/>
      </td>
   </tr>
   <tr>
      <td colspan=3>
         <img src=srccontinuous.png />
      </td>
   </tr>
   <tr>
      <td colspan=3>
         <img src=srcfooter.png />
      </td>
   </tr>
</table>

我知道我必须重复一些小图像，但我应该在哪里插入呢？如何？我有一个高度为 2px 的图像，可以一直放置在左、右和页脚之间，它被称为 srccontinues。

所以现在我正在使用它

<table border=1 cellspacing="0" cellpadding="0" style="width: 640px; border: transparent;" align="center">
    <tr>
    <td colspan="3"><img src="header.png" style="display: block"/></td>
    </tr>
    <tr>
    <td colspan="3"><img src="bg-top.png" style="display: block"/></td>
    </tr>
<tr style="height: 670px; border-left: thin solid black;">
    <td><img src="bg-left.png" style="display: block"/></td>
    <td valign="top" rowspan=2 ><p>Lorem ipsa erat. </p>
    <p>Lorem ipsum dol</p>

    </td>
    <td><img align="right" src="bg-right.png" style="display: block"/></td>
</tr>
<tr>
<td background="http://zmb-asistenca.bugs3.com/emailSlike/cont.png"></td>
<td background="http://zmb-asistenca.bugs3.com/emailSlike/cont.png"></td>
</tr>
<tr>
<td colspan=3><img src="bg-footer.png" style="display: block"/></td>
</tr>
</table>

当我在桌子上使用边框 = 1 时效果非常好，但我不想要边框。因此，当我将其设置为 0 时，它会扩展第二行，因此左侧和顶部图像上方有很多空间：S

有任何想法吗？

4

2 回答 2

2

IMG 标记旨在将单个图像放置到您的页面上。如果您希望在某个区域上重复图像，则必须通过 css 将其应用为重复背景。W3Schools 有一篇关于CSS 背景的好文章，它解释了这一切。您将看到“背景图像”和“背景重复”。

于 2012-10-02T10:47:01.617 回答
2

您应该使用 CSS3border-image属性，而不是图像。看看这个页面

于 2012-10-02T10:41:18.777 回答