头部使用<header class="mui-bar mui-bar-nav">
底部使用<nav class="mui-bar mui-bar-tab">
中间<div class="mui-content">
但<div class="mui-content">区域不能自适应高度,是要动态去算?还是mui有解决方法呢?
头部使用<header class="mui-bar mui-bar-nav">
底部使用<nav class="mui-bar mui-bar-tab">
中间<div class="mui-content">
但<div class="mui-content">区域不能自适应高度,是要动态去算?还是mui有解决方法呢?
11 个回复
Yooye
同问:背景图片需要在content的底部,贴在webview顶上!自适应不了啊
小微
放在mui-scroll里滚动不行吗
Yooye
是这样子的:mui-content距离底部的tab为什么总有那么一些空白,不能自动填满,且让背景图片显示在最底部
小微
不知道你这个背景图片是怎么写的,这个应该是样式问题。你可以考虑使用firebug看看css。
mui也是支持手动调整样式的。像。subpages: [{
id: 'list',
url: 'list.html',
styles: {
top: '48px',
bottom: 0,
bounce: 'vertical'
}
}]
<style type="text/css">
list {
可以自己写样式控制
Yooye
我的这个是跟andriod原生套用在一起的,title跟tab都是原生写的,只有中间的content是HTML网页!
小微
你可以试着不用mui的东西,用普通的div看,会不会出现底部空一块的现象,如果还有,说明是你安卓原生的webview与底部有间隙
Yooye
感谢耐心回答,我试试!
2015-01-23 11:48
踩着单车载着猪
背景写在body里不是很好解决?
Yooye
嗯!谢谢!
2015-01-23 16:23
DCloud_UNI_FXY
设置一下html,body的背景颜色跟mui-content的背景颜色一致即可
Yooye
感谢回答!已解决。我主要是需要在content的底部放一张背景图片。解决方法如下
2015-01-23 16:19
Yooye
开始的时候我的body高度是包含元素的高度。设置高度之后就实现了。
html,body{
width: 100%;
height: 100%;
}
.mui-content{
background: url(images/index_bg.png) bottom center no-repeat #efeff4 ;
background-size: 100%;
width: 100%;
height: 100%;
}
1***@qq.com
提供一种思路,自己定义一个样式,用css3的clac()来设置mui-content区域的高度。
如:
.mui-content{
height: calc(100vh - 顶部高度px - 底部高度px);
}
vh Viewport高度, 1vh 等于viewport高的的1%
这种做法我觉得在有滚动区域的时候很有用,供大家参考。
貪玩
自适应代码如下,各位可以拷贝过去参考一下.