bootstrap框架下为div标签设置动态高度
bootstrap框架下是可以动态设置div的高度的,解决方案就是通过jQuery进行动态操作,设置div的高度即可解决。我遇到的问题是报告内容超过了我之前设置的div高度,这个div是有背景色的,所以没有办法自适应整个文档对象的高度。一开始我设置了该div的height属性为100%,但是不生效。后来通过dom操作的方法实现了。
问题溯源:
最开始在属性设置为:height: 1200px
报告页面效果:
发现了问题请看下图
第一次修改是将height: 1200px改成height: 100%
修改后的效果:
修改后好像更严重了,emmm
正确的解决方案:
通过获取整个doc文档的高度设定div高度,完美解决!实现代码如下!
html示例:
<div id="pages" class="row" style="height:1200px;background-color: #f8fdfb;"> 这是我的div <div>
js代码实现:
<script>
//获取当前文档的高度,为报告准备动态高度,减去1000是为了减去封面的高度, // 剩余高度即是我们想要的报告页
var height= $(document).height()-1000; $("#pages").css('height',height+"px");
</script>
实现效果: