在CSS3中有可能有多个背景图像具有特定大小的每个？ [英] Is it possible in CSS3 to have multiple background images with specific size for each of them?

问题描述

我有DIV有2个背景，在我的情况下，它是渐变和图像。我想改变背景图片的大小，但不是渐变的大小？可能吗？

请注意：我不想使用2个DIV，一个用于渐变，一个用于背景图像

EDIT：

 < div id =button>< / div> 
 
 #button {background：url（img.png）no-repeat 0.5em 0.5em，-webkit-gradient（linear，left top，left bottom，from（＃74ae0f），to（＃497105 ））; } 
  

解决方案

对我的问题。我无法在互联网上的任何地方找到它，所以我只是尝试这个，它工作，因为我想：

  background-size ：2em 2em，100％100％; 
  

第一个声明2em 2em适用于背景图片，第二个声明100％100％适用于背景渐变。因此，在后台定义中声明使用与两个背景相同的顺序。

现在看起来简单直接，但在任何文档或网页中找不到。 / p>

I have DIV which has 2 backgrounds, in my case, it is gradient and image. I want to change the size of the background image, but not the size of the gradient ? Is it possible ?

Please note: I don't want to use 2 DIVs, one for gradient and one for background image

EDIT:

<div id="button"></div>

#button { background: url(img.png) no-repeat 0.5em 0.5em, -webkit-gradient(linear, left top, left bottom, from(#74ae0f), to(#497105)); }

解决方案

Ok, by just simple coincidence I have found answer to my question. I couldn't find it anywhere on the internet, so I just tried this and it worked as I wanted:

background-size: 2em 2em, 100% 100%;

The first declaration "2em 2em" applies to background image and the second declaration "100% 100%" applies to background gradient. Therefore using the same order as both backgrounds were declared in background definition.

Now it seems simple and straightforward, but I didn't find it in any documentation or webpage.

这篇关于在CSS3中有可能有多个背景图像具有特定大小的每个？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！