怎么在cs中分割图片

  介绍

怎么在cs中分割图片?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

场景:如果一个页面有个img小图标,那么访问浏览器的时候会因为加载图片导致浏览速度放慢。这个时候将这么多的小图标放在一起,整合成一个img,那么只需要访问一张图片就可以了。就可以减少请求图片的次数

怎么在cs中分割图片”> <br/> <强>方法一</强> <br/> </p> <p>在CSS中元素的背景:background - | |背景图片| | background-repeate | | background-attachment | |背景位置,示例如下:</p> <blockquote> <p>背景:透明的url (123. jpg)没有重演滚动-140 px -20 px; </p> </引用> <blockquote> <p>透明表示透明度无颜色</p> <p> url (123. jpg)表示背景图片</p> <p>没有重演表示图片不重复</p> <p>滚动表示背景图片随浏览器下拉而滚动</p> <p> -140 px表示水平位置在图片的-140 px处(以图片的左上角为0,0)</p> <p> -20 px表示垂直位置在图片的-20 px处</p> </引用> <p>但是我发现上面的不适合我想要的,</p> <p class= 怎么在cs中分割图片

上面的效果来看只能显示图片的右下角。那再试试第二种方法

<强>方法二

用img的剪辑属性中的矩形,片段:矩形(y1, y2, x2, x1)参数说明如下

日元=定位的y坐标(垂直方向)的起点

y2=定位的y坐标(垂直方向)的终点

x1=定位的x坐标(垂直方向)的起点

x2=定位的x坐标(垂直方向)的终点

注意:坐标的起点是在左上角

代码如下:

,,,,img {   ,,,,,,,位置:绝对;   ,,,,,,,片段:矩形(20 px  100 px ,, 50 px ,, 20 px);   }

怎么在cs中分割图片

在实际操作过程中,发现两个问题:1.矩形方法里面需要带上逗号,2。必须要带上的位置,并且需要是绝对定位,也就是绝对或者固定属性。

关于怎么在cs中分割图片问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注行业资讯频道了解更多相关知识。

怎么在cs中分割图片