CSS:给一个div的高度是一个数字的倍数?
div有tilable背景。这个div的高度将取决于其内容。我需要div来扩展多倍的背景图片大小。CSS:给一个div的高度是一个数字的倍数?
例如,背景是64x64图像。 所以,如果div的高度要增加,我想这样做的步骤为64px。
这是可能的CSS?我还没有找到使用谷歌的线索。谢谢你的时间!
据我所知,这不能在CSS中完成,但你可能可以解决它与一些JavaScript。如果您有权访问jQuery:
$(function() {
$div = $('#the_div_id');
var remainder = $div.height() % 64;
var newHeight = $div.height() + (64-remainder);
$div.css('height', newHeight);
});
即使没有jQuery,也可以用javascript解决。 – Rob 2012-02-10 14:12:09
是的,我认为我会在文档准备好之后以这种方式走下去。谢谢=) – Jem 2012-02-10 14:38:14
不客气。顺便说一句,'$(function(){...});'是“当DOM准备就绪时执行此操作”的简写形式,以防您对jQuery不熟悉。正如@Rob所说,它也可以用原生Javascript完成,我个人更喜欢jQuery。 – Christoffer 2012-02-10 15:09:12
一个解决方案(取决于您的具体情况)可能是使用新的background-size
CSS属性。我已经离开了单独的声明为清楚起见:
div.yourDiv {
background-image: url('yourImage.jpg');
background-repeat: repeat;
background-size: contain;
}
然后,无论你div
大小,你的形象将瓦片完全没有被切断。较老的浏览器只会得到平铺的图像,这可能是也可能不是问题。
非常有趣,我现在试试这个! – Jem 2012-02-10 14:36:39
javascript可以接受吗? – ANeves 2012-02-10 14:00:39
你不能在CSS中这样做 - 一般来说,CSS不允许你在动态大小的元素的内容上设置样式。 – Oliver 2012-02-10 14:01:52
在简单的css中无法实现。试试jQuery。 – NewUser 2012-02-10 14:14:51