You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
186 lines
3.6 KiB
186 lines
3.6 KiB
@charset "UTF-8"; |
|
/** |
|
*相关初始化 |
|
*/ |
|
|
|
.font-color-red { |
|
color: #292929 !important; |
|
} |
|
.bg-color-red { |
|
background-color: #292929 !important; |
|
} |
|
.icon-color { |
|
color: #292929; |
|
} |
|
.cart-color { |
|
color: #292929 !important; |
|
border: 1px solid #292929 !important; |
|
} |
|
/* padding20 */ |
|
.padding20 { |
|
padding: 0.2*100rpx; |
|
} |
|
/* pad20 */ |
|
.pad20 { |
|
padding: 0 0.2*100rpx; |
|
} |
|
/* padding30 */ |
|
.padding30 { |
|
padding: 0.3*100rpx; |
|
} |
|
/*pad30 */ |
|
.pad30 { |
|
padding: 0 0.3*100rpx; |
|
} |
|
|
|
/* layout */ |
|
.acea-row-nowrap { |
|
display: flex; |
|
/* 辅助类 */ |
|
} |
|
.acea-row { |
|
display: flex; |
|
flex-wrap: wrap; |
|
/* 辅助类 */ |
|
} |
|
.acea-row.row-middle,.acea-row-nowrap.row-middle{ |
|
align-items: center; |
|
} |
|
.acea-row.row-top,.acea-row-nowrap.row-top { |
|
align-items: flex-start; |
|
} |
|
.acea-row.row-bottom { |
|
align-items: flex-end; |
|
} |
|
.acea-row.row-center,.acea-row-nowrap.row-center { |
|
justify-content: center; |
|
} |
|
.acea-row.row-right,.acea-row-nowrap.row-right { |
|
justify-content: flex-end; |
|
} |
|
.acea-row.row-left,.acea-row-nowrap.row-left { |
|
justify-content: flex-start; |
|
} |
|
.acea-row.row-between,.acea-row-nowrap.row-between { |
|
justify-content: space-between; |
|
} |
|
.acea-row.row-around, .acea-row-nowrap.row-around{ |
|
justify-content: space-around; |
|
} |
|
.acea-row.row-column-around,.acea-row-nowrap.row-column-around { |
|
flex-direction: column; |
|
justify-content: space-around; |
|
} |
|
.acea-row.row-column { |
|
flex-direction: column; |
|
} |
|
.acea-row.row-column-between,.acea-row-nowrap.row-column-between { |
|
flex-direction: column; |
|
justify-content: space-between; |
|
} |
|
/* 上下左右垂直居中 */ |
|
.acea-row.row-center-wrapper,.acea-row-nowrap.row-center-wrapper { |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
/* 上下两边居中对齐 */ |
|
.acea-row.row-between-wrapper,.acea-row-nowrap.row-between-wrapper { |
|
align-items: center; |
|
justify-content: space-between; |
|
} |
|
|
|
/* 轮播图 */ |
|
.slider-banner { |
|
position: relative; |
|
width: 100%; |
|
/* height:750rpx; */ |
|
overflow: hidden; |
|
} |
|
.slider-banner{ |
|
|
|
} |
|
.slider-banner .swiper-container { |
|
height: 100%; |
|
} |
|
.slider-banner image{ |
|
display: block; |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.start { |
|
width: 1.22*100rpx; |
|
height: 0.3*100rpx; |
|
background-image: url("https://wx.yixiang.co/static/images/start.png"); |
|
background-repeat: no-repeat; |
|
background-size: 1.22*100rpx auto; |
|
} |
|
.start.star5 { |
|
background-position: 0 0.03*100rpx; |
|
} |
|
.start.star4 { |
|
background-position: 0 -0.3*100rpx; |
|
} |
|
.start.star3 { |
|
background-position: 0 -0.7*100rpx; |
|
} |
|
.start.star2 { |
|
background-position: 0 -1.05*100rpx; |
|
} |
|
.start.star1 { |
|
background-position: 0 -1.4*100rpx; |
|
} |
|
.start.star0 { |
|
background-position: 0 -1.75*100rpx; |
|
} |
|
/* 单选框和多选框 */ |
|
.checkbox-wrapper { |
|
position: relative; |
|
} |
|
.checkbox-wrapper input { |
|
display: none; |
|
} |
|
.checkbox-wrapper .icon { |
|
position: absolute; |
|
left: 0; |
|
top: 50%; |
|
display: inline-block; |
|
width: 18px; |
|
height: 18px; |
|
border: 1px solid #cccccc; |
|
border-radius: 50%; |
|
transform: translate(0, -50%); |
|
} |
|
.checkbox-wrapper input:checked + .icon { |
|
background-color: #e93323; |
|
border-color: #e93323; |
|
background-image: url("https://wx.yixiang.co/static/images/enter.png"); |
|
background-size: 0.21*100rpx 0.15*100rpx; |
|
background-repeat: no-repeat; |
|
background-position: center center; |
|
} |
|
.Loads { |
|
height: 0.8*100rpx; |
|
font-size: 0.25*100rpx; |
|
color: #000; |
|
} |
|
.Loads .iconfont { |
|
font-size: 0.3*100rpx; |
|
margin-right: 0.1*100rpx; |
|
height: 0.32*100rpx; |
|
line-height: 0.32*100rpx; |
|
} |
|
/*加载动画*/ |
|
@keyframes load { |
|
from { |
|
transform: rotate(0deg); |
|
} |
|
to { |
|
transform: rotate(360deg); |
|
} |
|
} |
|
.loadingpic { |
|
animation: load 3s linear 1s infinite; |
|
} |
|
.loading { |
|
animation: load linear 1s infinite; |
|
}
|
|
|