CSS:给div一个高度是数字的倍数？

Question

div有一个tilable背景.这个div的高度取决于它的内容.我需要div来拉伸背景图像大小的倍数.

例如,背景是64x64图像.所以,如果div的高度要增加,我想以64px的步长这样做.

这可能与CSS有关吗？我没有找到使用谷歌的线索.谢谢你的时间!

Answer 1

据我所知,这不能在CSS中完成,但你可以用一些javascript解决它.如果你有权访问jQuery:

$(function() {
    $div = $('#the_div_id');
    var remainder = $div.height() % 64;
    var newHeight = $div.height() + (64-remainder);
    $div.css('height', newHeight);
});

Answer 2

一种解决方案(取决于您的具体情况)可能是使用新的background-sizeCSS属性.为清楚起见,我将声明分开了:

div.yourDiv {
    background-image: url('yourImage.jpg');
    background-repeat: repeat;
    background-size: contain;
}

然后,无论你的大小如何div,你的图像都会很好地平铺,而不会被切断.较旧的浏览器只会获得平铺图像,这可能是也可能不是问题.