背景重复无法正常工作

Question

I have made a simple html page with an image on it to display as a header. 我已经制作了一个简单的html页面，上面带有图像以显示为标题。 The problem is that the image is not repeating. 问题是图像没有重复。

When I set the width to 100% the td ( side ) disappears. 当我将width设置为100% ，td（ side ）消失了。 If I remove width from basestrip , then it only covers half of the screen area. 如果我从basestrip删除width ，则它仅覆盖屏幕区域的一半。 I want to cover all of the screen with the image with the specified height. 我想用指定高度的图像覆盖整个屏幕。

<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>

This is the css: 这是CSS：

#side {
background-color: #014160;
}

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

Answer 1

First off, the element has no height property, that can be applied to the . 首先，该元素没有height属性，可以将其应用于。 Also you can not append the 'px' to a height or width attribute for an html tag, this only applies to CSS. 另外，您不能将'px'附加到html标签的height或width属性上，这仅适用于CSS。 I assume this table should be the width of the browser window, and 25 pixels high, 1 row with 3 cells, the first being 10px wide, the second you have not specified and the last you have 100%. 我假设此表应为浏览器窗口的宽度，高25像素，包含3个单元格的一行，第一个为10px宽，第二个为未指定，最后一个为100％。 Here is my cross browser approach: 这是我的跨浏览器方法：

<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

Try adding a width="100%" (or better a style="width: 100%" or even better with applying a CSS style of width: 100%) to your table. 尝试在表中添加width =“ 100％”（或更佳的style =“ width：100％”，甚至通过应用CSS样式width：100％更好）。 With your code, the cell takes 100% of the table. 使用您的代码，单元格将占用表的100％。 But the table takes by default the size of the content of all the cells. 但是该表默认使用所有单元格内容的大小。

Answer 3

这样的财产

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

背景重复无法正常工作

问题描述

3 个解决方案

解决方案1
0 2011-12-21 07:26:57

解决方案2
0 已采纳 2011-12-21 07:27:27

解决方案3
0 2011-12-21 07:55:54

背景重复无法正常工作

问题描述

3 个解决方案

解决方案1 0 2011-12-21 07:26:57

解决方案2 0 已采纳 2011-12-21 07:27:27

解决方案3 0 2011-12-21 07:55:54

解决方案1
0 2011-12-21 07:26:57

解决方案2
0 已采纳 2011-12-21 07:27:27

解决方案3
0 2011-12-21 07:55:54