为什么加了css样式反而不能正常显示?
问题描述:
做一个轮播图,没有加样式前可以正常显示,加了样式之后不能正常显示?
没有加样式前:
<!-- //<view class="swiper"> -->
<swiper indicator-dots="true" autoplay="true" interval="2000" circular="true">
<!-- 显示黑点、自动播放、自动播放时间、到最后一个后自动回到第一个循环播放 -->
<swiper-item>
<view>
<image src="../../static/1.jpg" mode=""></image>
</view>
</swiper-item>
<swiper-item>
<view>
<image src="../../static/2.jpg" mode=""></image>
</view>
</swiper-item>
<swiper-item>
<view>
<image src="../../static/3.jpg" mode=""></image>
</view>
</swiper-item>
<swiper-item>
<view>
<image src="../../static/4.jpg" mode=""></image>
</view>
</swiper-item>
<swiper-item>
<view>
<image src="../../static/5.jpg" mode=""></image>
</view>
</swiper-item>
</swiper>
<!-- </view> -->
正常显示轮播图
把上面代码的注释去掉,加了样式之后
<style lang="scss">
.swiper{
width: 640rpx;
height: 480rpx;
image{
height: 100%;
width: 100%;
}
}
</style>
图片不显示了
为啥呀?
答
图片没有高度吧
答
你的这个 .swiper 在html里都没有定义吧,
答
给这个view加宽高
答
加上去就可以了!
谢谢各位!!!
我终于知道了!是我没有在image前加上它的上级
加上去就可以了!
谢谢各位!!!