JS可以根據CSS中的圖片信息生成新的圖片。這在網頁設計中經常用到。以下是一個使用JS生成圖片的例子：

var canvas = document.createElement('canvas');
canvas.width = 200;
canvas.height = 200;
document.body.appendChild(canvas);
var ctx = canvas.getContext('2d');
var img = new Image();
img.onload = function() {
var pattern = ctx.createPattern(img, 'repeat');
ctx.rect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = pattern;
ctx.fill();
};
img.src = 'example.png';

上面的代碼使用了HTML5的<canvas>元素，創建了一個200x200的畫布。接著用<canvas>元素的getContext()方法獲取了畫布上下文對象。接著創建了一個Image對象，并將其src屬性賦值為example.png。

當圖片加載完成后，onload函數就會被調用。我們將該圖片作為圖案填充到畫布上，并使用createPattern方法創建一個“repeat”樣式的圖案，并使用fillStyle屬性將圖案應用到畫布上。

在實際編寫網頁時，這種技術可以用于背景圖案的生成，在標簽中應用CSS，也可以用于電子照片處理等。當您想要實現更加復雜的效果時，使用JS生成圖片能夠起到很好的輔助作用。