如何在页面上仅显示背景图像的右/左停止？

Question

我用一张桌子来显示几张图片。我需要在第一个td元素中显示左半部分图像，在第二个td元素中显示它的右半部分。这是因为有些图像的宽度与其他图像相同。我以为我使用div并使用child-div将此图像设置为前两个td元素的背景图像。现在我正在摆弄使用css。

有什么建议吗？

更新：工作示例：http://jsfiddle.net/BkAcu/2/

Answer 1

使用background-position: <horizontal> <vertical>，其中<horizontal>和<vertical>是背景偏移，与background-repeat: no-repeat一起使用。

将background-position设置为负值，将bg移动到左侧。

另请参阅：https://developer.mozilla.org/en/CSS/background-position

示例（假设您的TD的宽度为100px，图像为200px）;

#td1, #td2 {
    background: url("200.png") no-repeat;
}
#td2 {
    background-position: -100px;
}