weixin_41542494 2018-02-03 15:16 采纳率: 80%
浏览 1000
已采纳

小程序 絕對定位 上拉加載 非常困難 頂不到導致有缺陷

我的問題 之前有調整過 當時候 正常 今天改了 一下 上拉加載非常的困難

我使用了fixed 這個定位 我在右邊的view ab 麻煩看一下 我的css

page {
background: #f5f5f5;
}

/*总体主盒子*/

#container {
position: relative;
width: 100%;
height: 100%;
background-color: #fff;
color: #939393;
}

/*左侧栏主盒子*/

.nav_left {
/*设置行内块级元素(没使用定位)*/
position: fixed;
width: 25%;
height:100%;
/*主盒子设置背景色为灰色*/
background: #f5f5f5;
text-align: center;

}

/*左侧栏list的item*/

.nav_left .nav_left_items {
/*每个高30px*/
height: 30px;
/*垂直居中*/
line-height: 30px;
/*再设上下padding增加高度,总高42px*/
padding: 6px 0;
font-size: 16px;
}
/*左侧栏list的item被选中时*/
.nav_left .nav_left_items.active {
/*背景色变成白色*/
background: #fff;
display: flex;
justify-content: space-between;
}
.nav_left .nav_left_items.active view:nth-child(1){
background: #fff000;
padding: 10rpx 5rpx;
}
.nav_left .nav_left_items.active view:nth-child(2){
font-size: 17px;
color: #000000;
}
/*右侧栏主盒子*/

.nav_right {
/*右侧盒子使用了绝对定位*/
position: absolute;
top: 0;
right: 0;
/*宽度75%,高度占满,并使用百分比布局*/
width: 75%;
box-sizing: border-box;
background: #fff;

}

.hot-poster {
display: flex;
flex-direction: column;
height: 84px;
border-bottom: 1px solid #dedede;
}

.hot-intro {
display: flex;
flex-direction: row;
}

.hot-img {
width: 40%;
margin: 10rpx;
}

.hot-img image {
width: 108px;
height:72px;
}

.hot-title {
display: flex;
flex-direction: column;
justify-content: space-between;
width:58%;
margin: 15rpx 0;

}

.hot-title view:nth-child(1) {
font-size: 14px;
color: #000000;
align-self: flex-start;
}

.hot-title view:nth-child(2) {
font-size: 12px;
color: #999;
align-self: flex-start;
}

/* 右側上方導航盒*/

.nav_rigth_Nav{
position: fixed;
top: 0;
right: 0;
/*宽度75%,高度占满,并使用百分比布局*/
width: 75%;
padding: 9px 15px 9px 9px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
background: #fff;
font-size: 16px;
z-index: 99;
border-bottom: 1px solid #dedede;
}
.nav_riget_personal{
align-self: center;
color:#242424;
}

.nav_riget_box{
position: relative;
text-align: right;

}
.nav_select{
margin-top:41px;
z-index: 100;
position: fixed;
top: 0;
left: 188rpx;
text-align: right;
background: #FFFFFF;
width: 94%;

}
.nav_one{
height: 30px;
font-size: 16px;
padding: 6px 15px 6px 0;
background: #FFFFFF;
margin-right: 100rpx;
text-align: right;
line-height: 30px;
width: 75%;
display: flex;
justify-content: flex-end;
color:#242424;
border-bottom: 1px solid #dedede;
}

  • 写回答

3条回答 默认 最新

  • devmiao 2018-02-03 15:23
    关注
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 用windows做服务的同志有吗
  • ¥60 求一个简单的网页(标签-安全|关键词-上传)
  • ¥35 lstm时间序列共享单车预测,loss值优化,参数优化算法
  • ¥15 Python中的request,如何使用ssr节点,通过代理requests网页。本人在泰国,需要用大陆ip才能玩网页游戏,合法合规。
  • ¥100 为什么这个恒流源电路不能恒流?
  • ¥15 有偿求跨组件数据流路径图
  • ¥15 写一个方法checkPerson,入参实体类Person,出参布尔值
  • ¥15 我想咨询一下路面纹理三维点云数据处理的一些问题,上传的坐标文件里是怎么对无序点进行编号的,以及xy坐标在处理的时候是进行整体模型分片处理的吗
  • ¥15 一直显示正在等待HID—ISP
  • ¥15 Python turtle 画图