Css 如何重新调整雪碧的一部分大小?
我需要重新调整精灵给定区域的大小。我的原始图像是800px乘以200px。我设置Css 如何重新调整雪碧的一部分大小?,css,Css,我需要重新调整精灵给定区域的大小。我的原始图像是800px乘以200px。我设置背景位置:200px 0px和宽度:100px;高度:25px这给出了精灵的正确部分,但我想知道是否有可能将精灵的这部分大小重新调整为200px乘以50px。但背景尺寸:200px 50px将整个精灵的大小调整到这个大小,而不仅仅是我感兴趣的区域 谢谢 我尽量做到概括性,这样就不会有麻烦。您可以尝试使用百分比按比例缩放图像。例如,要将该部分翻倍到200px乘以50px,请使用: background-size: 20
背景位置:200px 0px编码>和宽度:100px;高度:25px代码>这给出了精灵的正确部分,但我想知道是否有可能将精灵的这部分大小重新调整为200px乘以50px。但背景尺寸:200px 50px代码>将整个精灵的大小调整到这个大小,而不仅仅是我感兴趣的区域
谢谢
我尽量做到概括性,这样就不会有麻烦。您可以尝试使用百分比按比例缩放图像。例如,要将该部分翻倍到200px乘以50px,请使用:
background-size: 200% 200%;
这将分别将背景大小调整为。您可能需要调整背景位置
值以适应这种缩放方法,具体取决于您的布局或用例
请注意,背景大小
并不是专门为精灵设计的,因此这可能会也可能不会达到您想要的效果。不,您不能使用CSS缩放图像的一部分。我按百分比测试了背景大小,惊奇地发现Chrome上的缩放比例不是1:1
背景大小:50%
将背景图像加倍。当200%
时,它似乎成指数级扩展
抱歉,但不可能。您可以编辑精灵以包含较大的图像吗?我会试着用它来做实验。这种行为是故意的。请参阅(我在前面的回答中已经链接到)。它不是图像固有尺寸的50%或200%,而是容器的50%或200%。现在就非常有意义了。谢谢