Html &引用;img";在;运输署";及;背景图像“;“的;运输署";身高不同

Html &引用;img";在;运输署";及;背景图像“;“的;运输署";身高不同,html,css,image,background-image,Html,Css,Image,Background Image,我有两张照片: left.jpg是250px-by-47px right.jpg是1px-by-47px 它们被放入同一表格行的两个单元格中: left.jpg进入 问题:如何使单元格高度47px,并消除白色条带?谢谢 更新:这些帮助都没有: * { margin: 0; padding: 0; } table { width: 100%; border-bottom: solid 1px black; border-collapse: colla

我有两张照片:

  • left.jpg
    250px
    -by-
    47px
  • right.jpg
    1px
    -by-
    47px
它们被放入同一表格行的两个单元格中:

  • left.jpg
    进入

    问题:如何使单元格高度
    47px
    ,并消除白色条带?谢谢

    更新:这些帮助都没有:

    * {
        margin: 0;
        padding: 0;
    }
    
    table {
        width: 100%;
        border-bottom: solid 1px black;
        border-collapse: collapse;
    }
    

    图像显示为一个内联元素,在基线下方有一些空白

    尝试:


    如需输入文本,请参见图像添加垂直底部填充。要消除此问题,请将以下任一CSS属性添加到图像中:

  • 显示:块
  • 垂直对齐:顶部
  • float:左

  • 我建议
    display:block

    为什么要用表格来做这个?!你想干什么?在CSS中设置
    的宽度,并给它一个
    背景图像,可能有更简单的方法。另外,你做桌子的方式是完全错误的,你做梯度的方式是完全错误的。即使您必须支持IE5,您仍然可以在
    背景色上平铺并垂直重复
    背景图像
    。@ThiefMaster这是遗留代码。实际代码要复杂得多,我提取了显示问题的最小部分。将高度设置为
    td
    不起作用,因为表格单元格中的高度被解释为最小值。表格单元格将根据需要垂直展开以包含其内容。
    * {
        margin: 0;
        padding: 0;
    }
    
    table {
        width: 100%;
        border-bottom: solid 1px black;
        border-collapse: collapse;
    }
    
    tbody { height: 47px; }
    tr { height: 47px; }
    td { height: 47px; }
    
    img {
        vertical-align: top;
    }