设置height:100%;无效果的解决方法

用css设置样式时,width:100%会自动填满整个屏幕的宽度,所以觉得设置height:100%也会有同样的效果,但确实是被打脸了,设置height:100%时,只会自动适应子元素的高度,想要填充整个屏幕的高度,只给该元素设置height:100%是无法实现的。

  1. 在正常的HTML中,要使该元素自动填充整个屏幕的高度,必须给他的所有父级元素也设置height:100%
<html style="height:100%;">
    <body style="height:100%;">
        <div style="height:100%;">
            <p></p>
        </div>
    </body>
</html>
  1. 在小程序中,并没有HTML和body元素,那应该怎么样去设置让高度高度自动填充呢?因为小程序中有一个名叫page的注册页面的方法,所以应该如下设置:
<view class='firstInMain'>
    <view class="setVoice {{showVoice?'':'hidden'}}">
        <view class='setVoiceTitle'>这里是标题</view>
    </view>
</view>
page{
  height: 100%;
}
.firstInMain{
  height: 100%;
}
.setVoice{
  height: 100%;
}
.setVoiceTitle{
  margin: 0 auto;
  width: 200rpx;
}

没有更多推荐了,返回首页

私密
私密原因:
请选择设置私密原因
  • 广告
  • 抄袭
  • 版权
  • 政治
  • 色情
  • 无意义
  • 其他
其他原因:
120
出错啦
系统繁忙,请稍后再试

关闭