Question

我所拥有的是带有一些项目的div（菜单项），这个div将是浏览器查看器的高度，我想要<p>之间的间距来填充div的高度。

因此，对于一个1024px的屏幕，在段落之间间距为20 px，但有时最好为17px，对于某些大屏幕，22 px应该没问题。

你有自动计算这个或jQuery插件的javascript函数吗？

Answer 1

如果我理解正确，你正在寻找根据父div的高度修改p标签的边距 - 也许这样会有所帮助

MAX = 200;
if ($('div').height() > MAX) {
  $('p').attr('style', 'margin:10px 0 10px 0;')
} else {
  $('p').attr('style', 'margin:0 0 0 0;')
}

Answer 2

有一个名为flexbox的新css模块。检查this。基本上将容器高度设置为100％，并将每个元素设置为flex:1 1 auto。也可以使用该网址

更多信息：这是一个jsfiddle。它很简陋，但展示了基本的想法。当您将其放入页面时，只需将.flex-container的高度设置为100%即可。（我将小提琴设置为400px因为100%没有在jsfiddle中获取结果帧高度。） CSS看起来令人生畏，因为很多都必须以供应商为前缀，但它实际上非常简单。

调整段落间距以填充div高度的函数

2 个答案: