1

我正在尝试使用相当简单的图像技巧制作一个动态大小的标题横幅。我将横幅图像放在表格单元格中，并将表格行的背景图像设置为横幅最右侧像素列的一个像素宽的重复。因此，横幅图像似乎会拉伸以适应屏幕宽度，而不会拉伸徽标。下面的代码是我到目前为止的整个页面，问题在屏幕截图中以红色圆圈显示。这是主图像结束和一个像素宽的背景图像开始的过渡。

看起来末端一像素宽的条被压缩了一个像素->使顶部正确对齐，而底部则偏离了一个像素。我应该补充一点，我已经多次检查图像以使图像数据正确无误。就 MSPaint 而言，它们是 %100 准确的。 

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body bgcolor="#000000">
    <form id="form1" runat="server">
    <div>

        <table style="width:100%; ">
            <tr style="background-image: url('Images/Banners/WebBannerWideBar.png')">
                                            <!--WebBannerWideBar is 1x100 px-->
                <td>
                    <img alt="Angry Octopus"
                     src="Images/Banners/WebBannerWide.png" />
                          <!--WebBannerWide is 760x100 px-->
                </td>
            </tr>
        </table>

    </div>
    </form>
</body>
</html>

http://img188.imageshack.us/img188/1958/imagealignmentproblemsm.png

4

2 回答 2

2

我将横幅图像放在表格单元格中

不要那样做。这不是 1997 年。

将图片包裹在一个div中，在div上设置背景图片。调整 div 的内边距、边框和边距以适合。调整图像的垂直对齐。

于 2009-08-06T21:22:18.827 回答
1

尝试将表格中的单元格间距和单元格填充设置为 0px。

根据您不知道的一些填充，您的图像可能对于空间来说太大了。

此外，您可以设置单元格的填充：

<td style="padding: 0px;"...
于 2009-08-06T21:21:26.567 回答