如何强制图像在表格单元格中溢出而不展开单元格？强制图像在表格单元格中溢出

编辑：

对不起，我会提供一些更多的信息。这是表：

<table class="content"> 
    <col width="200px" /> 
    <col width="560px" /> 
    <col width="200px" /> 
    <tr> 
     <td colspan="3" class="logo"></td> 
    </tr> 
</table>

CSS：

.logo 
{ 
    height: 120px; 
    background: url('img/wallpaper.png') center; 
}

我以为会有一个简单的解决方案...

来源

2013-03-20 Stylock

*非常低质量：*你尝试过什么？你的代码在哪里？ – 2013-03-20 12:57:53

嗯，我试着用表格来嵌套表格，但是我想知道如何强制图片溢出。 – Stylock 2013-03-20 13:15:21

如果使用<img>标签，而不是一个背景图像，你可以从文件流程，position: absolute;

HTML

<td class="logo"> 
    <img src="img/wallpaper.png"> 
</td>

CSS

.logo img { 
    position: absolute; 
}

此删除会让图像溢出细胞，但是会产生您需要处理的其他副作用。相应地更新顶部或底部以保持图像到位。

调整CSS

.logo img { 
    position: absolute; 
    top: 15px; 
}

退房http://jsfiddle.net/QMNRp/1/

来源

2013-03-20 13:24:37 xec

这很好用，但是它创建了x-scroll，我不需要它。我实际上意识到我可能需要将徽标图像附加到身体壁纸。我试图在x方向上扩展徽标图像而不创建x-scroll等。 – Stylock 2013-03-20 13:53:13

-1

设置静态宽度运输署的，并设置overflow到visible和text-wrap:nowrap;或word-break到keep all表格中的文字

td{ 
width:100px; 
max-width:100px; 
overflow:visible 
text-wrap:nowrap; //for text 
word-break:keep-all; // for text 
}

来源

2013-03-20 13:04:03

@xec请检查答案的时间与问题的编辑。回答下面的问题，因为它不再适用于**问题编辑后**是非常不公平的。 – 2013-03-20 13:14:33

@JamesDonnelly你是对的，我会删除downvote，除了这个答案无助于防止表格单元拉伸，背景图像或其他。 – xec 2013-03-20 13:18:20

@xec仅供参考本* *将适用于溢出宽度，但不适用于高度：http://jsfiddle.net/erKGm/ – 2013-03-20 13:25:50

您正在要求元素的background转义到前景。这是不可能的。元素的背景只能和元素本身一样大。

要使.logo图像具有与包含单元格相同的尺寸，您可以在旧版浏览器中使用background-size property，但使用isn't supported。

来源

2013-03-20 13:13:48

强制图像在表格单元格中溢出

编辑：

回答

相关问题