收藏
回答

轮播图的边框圆不显示,这是代码,麻烦高手指点?

<!--pages/index2/index.wxml-->

<scroll-view class="scroll-view_Hscroll-x="truebindscroll="scrollstyle="width: 100%">

  <view id="demo1class="sitem">{{bd[0]}}</view>

  <view id="demo2class="sitem">{{bd[1]}}</view>

  <view id="demo3class="sitem">{{bd[2]}}</view>

  <view id="demo3class="sitem">{{bd[3]}}</view>

  <view id="demo3class="sitem">{{bd[4]}}</view>

  <view id="demo3class="sitem">{{bd[5]}}</view>

  <view id="demo3class="sitem">{{bd[6]}}</view>

</scroll-view>


<view class="topback"></view>


<view class="viewswiper">

  <swiper class="swiperindicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">

    <block wx:for="{{background}}" wx:key="*this">

      <swiper-item>

        <view class="swiper-item {{item}}">

          <image class="imagesrc="{{item}}" />

        </view>

      </swiper-item>

    </block>

  </swiper>

</view>

/* pages/index2/index.wxss */

.scroll-view_H{

  white-space: nowrap;

  background-color: rgb(0, 255, 136);

}

/* .scroll-view_H的background-color与.sitem的background-color均设置为红色,为了中间没空隙 */

.sitem{

  display: inline-block;

  width: 20%;

  height: 80rpx;

  background-color: rgb(76, 0, 255);

  margin-left: 10rpx;

  text-align: center;

  line-height: 80rpx;

}

.topback{

  background-color: rgb(255, 0, 0);

  height: 200rpx;

  border-radius: 0 0 5% 5%;

}

.swiper-item{

  height: 100%;

  width: 100%;

  border-radius: 50rpx;

  background-color: blueviolet;

}

.image{

  background-color: aqua;

  border-radius: 50rpx;

}

.viewswiper{

  margin-top: -120rpx;

  height: 600rpx;

  border-radius: 50rpx;

}

.swiper{

  width: 90%;

  margin: 0 auto;

  background-color: rgb(0, 255, 55);

}


回答关注问题邀请回答
收藏

1 个回答

  • 那一抹笑😃 穿透阳光
    那一抹笑😃 穿透阳光
    2023-11-06

    viewswiper 这个里面添加一个overflow: hidden;

    .swiper这个里面添加overflow: hidden;或者border-radius: 50rpx;


    2023-11-06
    有用
    回复
登录 后发表内容