快乐的小面包
2021-03-10 18:54
采纳率: 100%
浏览 194

关于微信小程序界面css样式的问题急急急求大佬!

最近在做微信小程序,商城分类界面的css样式出了问题好像,图片怎么也顶部上去

并附上代码

页面代码

<view class="types">

  <scroll-view 

  class="left"

  >

 

    <view class="{{index==activeIndex?'active':''}}"  bindtap="click" data-index="{{index}}" wx:for="{{types}}">

      {{item.name}}

    </view>

  </scroll-view>

  <scroll-view

  class="right"

  >

  <view class="tittle">

    查看{{tittle}} 下的所有产品 >

  </view>

  <view class="container">

   <image src="{{pic}}" class="pic"></image>

 

   <view > {{text}}12312312312312312</view>

  </view>


 

  </scroll-view>

</view>

 

 

css样式代码

/* pages/types/types.wxss */

page{

  background:#cccccc;

  height: 100%;

  font-size:32rpx;

}

 

.types{

  display: flex;

  height: 100%;

 

}

.left{

  flex:2;

  height: 100%;

}

.left view{

  text-align: center;

  height: 90rpx;

  background:#ffffff;

  line-height: 90rpx;

}

.right{

  flex:8;

  height: 800rpx;

}

.right .tittle{

  background:#ffffff;

  text-align:center; 

  width:90%;

  line-height: 90rpx;

  margin:20rpx auto  0;

  border-radius: 10rpx;

}

.right .container{

  width: 90%;

  background:#ffffff;

  /* height: 1000rpx; */

  margin:20rpx auto  0;

}

.active{

  background:#cccccc;

}

.container .pic{

  float: left;

}

.container .pic{

  width: 100%;

  height:100%;


 

}

 

.types .left .active{

  background:red;

}


 

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

6条回答 默认 最新

相关推荐 更多相似问题