为什么加了css样式反而不能正常显示?

为什么加了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加宽高

img

我终于知道了!是我没有在image前加上它的上级

img


加上去就可以了!
谢谢各位!!!