為頁面上的多個div容器調整1個背景圖像的大小

Question

我有一個超級花哨的背景圖像需要擴展為一頁3個盒子的背景，100％高度/寬度。 這可能嗎？

NOT 1背景縮放為整個頁面背景。

但

| 方框1（50x50）獲得背景| | 方框2（20x20）獲取背景| 等等

我想為所有這些div分配類“背景”，並使用一個背景圖像，根據div的尺寸進行縮放。 它是正方形，如果看起來有些變形，也可以

僅供參考-這是面板頁面的drupal布局。

Answer 1

我不知道您的瀏覽器限制，但是有一個CSS3屬性，稱為background-size 。 您只需將其設置為background-size: 100% 100% 。

Answer 2

.background img {
    height: 100%;
    width: auto;
}

這將使圖像格柵適合div的高度@ 100％高度和自然縮放寬度：自動。