css 取一张图片的一部分

CSS中经常需要取一张图片的一部分来使用。这个操作可以使用background-position和background-size属性来实现。

code>
    background-position: x-axis y-axis;
     //设置背景图片的起始位置 background-size: width height;
     //设置背景图片大小/code>
    

其中，background-position属性用于设置背景图片的起始位置。它可以接收两个值，分别是x-axis和y-axis。

x-axis表示背景图片在水平方向上的位置，它可以使用像素、百分比、left、right、center等值来表示。同样，y-axis表示在垂直方向上的位置。

而background-size属性用于设置背景图片的大小。它同样可以使用像素、百分比等值来表示。如果只设置一个值，则表示图片在水平和垂直方向上都按照这个比例缩放。

下面是一个取一张图片左上角一部分的例子：

code>
    style>
    .demo {
            width: 200px;
            height: 200px;
            background-image: url('example.png');
            background-position: 0px 0px;
            background-size: 50px 50px;
    }
    /style>
    div class="demo">
    /div>
    /code>
    

在这个例子中，我们设置了一个宽高为200px的div容器，并使用了一个名为example.png的图片作为背景图片。然后，我们通过background-position属性设置了背景图片的起始位置为左上角，并使用background-size属性将图片缩小到了50x50的大小。

这样就能够取到图片左上角的一部分了。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！