Javascript 使用css在div中仅显示图像的一部分

我拥有的：
我有一个宽200px 200px的div
里面的图像大小是400px X 400px

我想做什么：
我只想显示div中图像的一部分 是否可以只使用css？如果不可以的话？那么还有什么方法
（注意：我不想将image设置为div的背景）

到目前为止我所做的：
小提琴：

我想显示从100100到300300的图像。
滚动条应该消失。
任何帮助都将不胜感激

---

谢谢

在父元素上使用

位置：相对

，在子图像上使用

位置：绝对

---

要使滚动条消失，请使用

overflow:hidden

（如在JSFIDLE中）

以下是解决问题的方法：

---

此方法允许您使用一个元素（而不是两个元素）实现相同的结果，并且也非常简单。我建议使用这种方法，而不是将图像绝对定位在容器分区内。

检查此方法。这就是你想要的吗？卡思克：不……我不想要这个。简单的溢出：隐藏不会起作用。再次阅读问题。**我想显示图像的一部分。**使用Alfred Xing：如果显示了图像的适当部分。我不需要使用溢出：隐藏检查：@panda这只是为了确保如果有较大的图像，滚动条不会显示：我在问题中提到，我不想将图像设置为div的背景。错过了这一点-所以阿尔弗雷德的答案就是这样case@nagesh是什么促使你们采取“我不想把图像设置为div的背景”的态度？这种方法有一些缺点吗？@andi:image标签，例如设置为背景时不起作用。

<div id="sample">
    <img src="image.jpg" /> 
</div>

#sample{
    background: url(image-data.jpg);
    background-position: -100px -100px;
    width: 200px;
    height: 200px;
}