Allow multiple images in the `image()` template function

[fluffy-critter]

Expected Behavior

CSS3 allows specifying multiple background-image properties to layer them. What would be nice is being able to have the image() function take multiple images and have the get_css_background method (or get_img_tag, for that matter) do the right thing for a set of multiple images.

Possible Solution

One possibility:

html {
    /*{{image('background_layer.png', 'logo.png').get_css_background(width=192,uncomment=True)}}*/
}

resulting in e.g.

html {
   /* */ background-image: url('background_layer_1x.png'), url('logo_1x.png');
    background-image: image-set(url('background_layer_1x.png') 1x, url('background_layer_2x.png') 2x), image_set(url('logo_1x.png') 1x, url('logo_2x.png') 2x); /* */
}

The obvious downside is it requires all image rendition arguments to match.

Another possibility may be to have an image take a list of image specifications instead, and then the final parameters act as the container arguments. For example:

image("background.png{192}","logo.png{scale=3}").get_css_background(uncomment=True)

or, relatedly:

image("foo.jpg{123}","bar.png").get_img_tag(width=100)

would be equivalent to the Publ-Markdown:

![{width=100}](foo.jpg{123} | bar.png)

Context

On http://beesbuzz.biz/blog/ the stylesheet currently uses html for the background layer and body for the logo, which works Okay but it causes perf issues in Safari and also makes the logo get cut off by overscrolling.