css - 将 CSS 应用于图像标记以仅显示下半部分

Question

我有一个图片标签，它显示一张宽 18 像素、高 36 像素的图片。但是，我只想显示图像底部的 18 x 18 像素，而不是完整的 18 x 36 像素。我该如何着手将样式应用到标签以实现此目的？

编辑:

感谢大家的帮助!是你们几个答案的结合让我走到了那里。我得出的最终样式如下 --

div.minus
{
    background-image: url('Images/PlusMinus.gif');
    background-repeat: no-repeat;
    background-position: bottom;
    margin : 0px;
    padding : 0px;
    height: 18px;
    width : 18px;
    overflow : hidden;
}

div.plus
{
    background-image: url('Images/PlusMinus.gif');
    background-repeat: no-repeat;
    background-position: top;
    margin : 0px;
    padding : 0px;
    height: 18px;
    width : 18px;
    overflow : hidden;
}

我尝试了 clip 属性，但运气不佳，而且我在最后期限前迫在眉睫，所以我以后不得不再弄乱它。再次感谢!

Answer 1

您可以将该图像应用于 <div> 的背景并将该 div 的高度和背景位置设置为 18 像素。

.cutoff {
  background: url('image.jpg');
  height: 18px;
  background-position: bottom;
}