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

div有tilable背景。这个div的高度将取决于其内容。我需要div来扩展多倍的背景图片大小。CSS：给一个div的高度是一个数字的倍数？

例如，背景是64x64图像。所以，如果div的高度要增加，我想这样做的步骤为64px。

这是可能的CSS？我还没有找到使用谷歌的线索。谢谢你的时间！

来源

2012-02-10 Jem

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

据我所知，这不能在CSS中完成，但你可能可以解决它与一些JavaScript。如果您有权访问jQuery：

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

来源

2012-02-10 14:07:22 Christoffer

即使没有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

div的内容是什么？这听起来像不是将div的大小设置为正确的值，您需要注意内容 - this post的细节一些非常简单的技术来实现垂直节奏，它应该工作（即通过使用64px的线高度）

来源

2012-02-10 14:10:47

它实际上是关于一个媚俗UI：div代表一个梯子，它的高度是成比例的从屏幕顶部到div的高度 - 使连接到终结器元素的必要平铺。 – Jem 2012-02-10 14:37:50

一个解决方案（取决于您的具体情况）可能是使用新的background-size CSS属性。我已经离开了单独的声明为清楚起见：

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

然后，无论你div大小，你的形象将瓦片完全没有被切断。较老的浏览器只会得到平铺的图像，这可能是也可能不是问题。

来源

2012-02-10 14:14:28 CherryFlavourPez

非常有趣，我现在试试这个！ – Jem 2012-02-10 14:36:39

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

回答

相关问题