scss的&-

1.代码scss样式多层嵌套的问题
& 用在嵌套代码里,来引用父元素

.swiper-slide {
   .comic{
	   .comic-content{
		   .comic-top{
		    }
	   }
   }
}

改为:

.swiper-slide {
	&-comic{
	}
	&-comic-content{
    }
    &-comic-top{
	}
}

转换成css为

.swiper-slide-comic{
}
.swiper-slide-comic-content{
}
.swiper-slide-comic-top{
}
	

更改的代码的链接:
https://git.woa.com/TAFE/act-mobile-2022/commit/2ca445e1134ca793240742275804d34b50bfb635?view=parallel
2.Html的 规范:普通标签使用小写,外部引入的组件标签使用大写

3.使代码简洁,不要写大量重复的逻辑代码(公共方法需封装,公共样式提取到公共样式中)

你可能感兴趣的:(scss,前端,css)