方法一：

    用CSS中元素的background : background-color || background-image || background-repeat || background-attachment || background-position。 示例代码如下：

    background:transparent url(123.jpg) no-repeat scroll -140px -20px;

    解释：

    transparent表示透明无颜色
    url(123.jpg) 表示背景图片
    no-repeat 表示图片不重复
    scroll 表示背景图片随浏览器下拉而滚动
    -140px 表示水平位置在图片的-140px处（以图片的左上角为0,0）
    -20px 表示垂直位置在图片的-20px处（以图片的左上角为0,0）

    方法二：

    用img的clip属性中的rect，clip:rect(y1 y1 x2 x1)参数说明如下：
    y1=定位的y坐标(垂直方向)的起点
    x1=定位的x坐标(水平方向)的起点
    y2=定位的y坐标(垂直方向)的终点
    x2=定位的x坐标(水平方向)的终点
    注:坐标的起点是在左上角

    示例代码：

    代码如下:

    img{
    position:absolute;
    clip:rect(20px 100px 50px 20px);
    }


    上面可以看出控制图片显示的关键在于clip:rect(20px 100px 50px 20px)这句，千万不要忘记position:absolute;这是用于使用绝对值来定位元素。