Question

我制作了一个简单的html页面，上面有一个图像显示为标题。问题是图像没有重复。

当我将width设置为100%时，td（side）消失了。如果我从width删除basestrip，则它只覆盖屏幕区域的一半。我希望用指定高度的图像覆盖所有屏幕。

<table cellpadding="0" cellspacing="0">
    <tr>
        <td id="side" width="10px" height="25px"></td>
        <td></td>
        <td id="basestrip" width="100%" height="25px">
                    </td> 
             </tr>
</table>

这是css：

#side {
background-color: #014160;
}

#basestrip {
    background-image: url('../Images/topstripbg.png');
    background-repeat: repeat-x;    
}

Answer 1

首先，元素没有高度属性，可以应用于。此外，您不能将'px'附加到html标记的height或width属性，这仅适用于CSS。我假设这个表应该是浏览器窗口的宽度，高25像素，1行有3个单元格，第一行是10px宽，第二个你没有指定，最后一个你有100％。这是我的跨浏览器方法：

<html>
  <head>
    <style type="text/css">
      #thetable { width:100%; height:25px; }
      #thetable>tr { height: 25px }
      #thetable>tr>td#side { width: 10px }
      #thetable>tr>td#basestrip { background: url('../Images/topstripbg.png') repeat-x; }
    </style>
  </head>

  <body>
    <table id="thetable" width="100%" cellpadding="0" cellspacing="0">
      <tr>
        <td id="side" width="10"></td>
        <td width="auto"></td>
        <td id="basestrip" width="100%"></td>
      </tr>
    </table>
  </body>
</html>

Answer 2

尝试在表格中添加宽度=“100％”（或更好的样式=“宽度：100％”，甚至更好地应用宽度：100％的CSS样式）。使用您的代码，单元格占用表格的100％。但该表默认采用所有单元格内容的大小。

Answer 3

取这样的属性

#basestrip { background: url('../Images/topstripbg.png') repeat-x;    }

背景重复不起作用

3 个答案: