html{
|
font-family:"Source Han Sans SC";
|
}
|
ul{
|
list-style-type: none;
|
}
|
.full-page{
|
height: 100vh;
|
margin: 0 auto;
|
background-color: #f3f4f6;
|
// overflow-y: auto;
|
// overflow-y: scroll;
|
}
|
.full-page-content{
|
// height: 100vh;
|
margin: 0 auto;
|
background-color: #f3f4f6;
|
// overflow-y: scroll;
|
}
|
.full-page-fff{
|
height: 100vh;
|
margin: 0 auto;
|
background-color: #fff;
|
}
|
// 底部按钮
|
.tabbtns {
|
background-color: #fff;
|
position: fixed;
|
width:100%;
|
box-sizing:border-box;
|
bottom: 0px;
|
left: 0;
|
right: 0;
|
z-index: 20;
|
padding: 24rpx;
|
}
|
.chuany-box{
|
box-sizing:border-box;
|
}
|
.list {
|
background-color: #f3f4f6;
|
}
|
/* flex弹性布局 */
|
.chuany-flex { display: flex; }
|
.chuany-flex-sub { flex: 1; }
|
.chuany-flex-twice { flex: 2; }
|
.chuany-flex-treble { flex: 3; }
|
.chuany-flex-direction { flex-direction: column; }
|
.chuany-flex-wrap { flex-wrap: wrap; }
|
|
.chuany-flex-direction-row { flex-direction: row }
|
.chuany-flex-direction-row-reverse { flex-direction: row-reverse }
|
.chuany-flex-direction-column { flex-direction: column }
|
.chuany-flex-direction-column-reverse { flex-direction: column-reverse }
|
|
.chuany-justify-start { justify-content: flex-start; }
|
.chuany-justify-end { justify-content: flex-end; }
|
.chuany-justify-center { justify-content: center; }
|
.chuany-justify-between { justify-content: space-between; }
|
.chuany-justify-around { justify-content: space-around; }
|
.chuany-justify-evenly { justify-content: space-evenly; }
|
|
.chuany-align-start { align-items: flex-start; }
|
.chuany-align-end { align-items: flex-end; }
|
.chuany-align-center { align-items: center; }
|
.chuany-align-stretch { align-items: stretch; }
|
.chuany-self-start { align-self: flex-start; }
|
.chuany-self-center { align-self: flex-center; }
|
.chuany-self-end { align-self: flex-end; }
|
.chuany-self-stretch { align-self: stretch; }
|
|
/*单行*/
|
.chuany-clamp { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
/*多行*/
|
.chuany-clamp2 { word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; white-space: normal !important; }
|
/*字体颜色*/
|
.chuany-text-green { background-color: #19be6b; color: #fff; }
|
.chuany-text-red, .line-red, .lines-red { color: #e54d42; }
|
.chuany-text-orange, .line-orange, .lines-orange { color: #f37b1d; }
|
.chuany-text-yellow, .line-yellow, .lines-yellow { color: #fbbd08; }
|
.chuany-text-olive, .line-olive, .lines-olive { color: #8dc63f; }
|
.chuany-text-green, .line-green, .lines-green { color: #39b54a; }
|
.chuany-text-cyan, .line-cyan, .lines-cyan { color: #1cbbb4; }
|
.chuany-text-blue, .line-blue, .lines-blue { color: #0081ff; }
|
.chuany-text-purple, .line-purple, .lines-purple { color: #6739b6; }
|
.chuany-text-mauve, .line-mauve, .lines-mauve { color: #9c26b0; }
|
.chuany-text-pink, .line-pink, .lines-pink { color: #e03997; }
|
.chuany-text-brown, .line-brown, .lines-brown { color: #a5673f; }
|
.chuany-text-grey, .line-grey, .lines-grey { color: #8799a3; }
|
.chuany-text-gray, .line-gray, .lines-gray { color: #aaaaaa; }
|
.chuany-text-black, .line-black, .lines-black { color: #333333; }
|
.chuany-text-white, .line-white, .lines-white { color: #ffffff; }
|
.text-7f{ color: #7f7f7f; }
|
.text-69{ color: #696969 !important; }
|
/*背景颜色*/
|
.coreshop-bg-red { background-color: #e54d42; color: #ffffff; }
|
.coreshop-bg-orange { background-color: #f37b1d; color: #ffffff; }
|
.coreshop-bg-yellow { background-color: #fbbd08; color: #333333; }
|
.coreshop-bg-olive { background-color: #8dc63f; color: #ffffff; }
|
.coreshop-bg-green { background-color: #39b54a; color: #ffffff; }
|
.coreshop-bg-cyan { background-color: #1cbbb4; color: #ffffff; }
|
.coreshop-bg-blue { background-color: #0081ff; color: #ffffff; }
|
.coreshop-bg-purple { background-color: #6739b6; color: #ffffff; }
|
.coreshop-bg-mauve { background-color: #9c26b0; color: #ffffff; }
|
.coreshop-bg-pink { background-color: #e03997; color: #ffffff; }
|
.coreshop-bg-brown { background-color: #a5673f; color: #ffffff; }
|
.coreshop-bg-grey { background-color: #8799a3; color: #ffffff; }
|
.coreshop-bg-gray { background-color: #f0f0f0; color: #333333; }
|
.coreshop-bg-black { background-color: #333333; color: #ffffff; }
|
.coreshop-bg-white { background-color: #ffffff; }
|
.coreshop-bg-fa { background-color: #fafafa; padding: 10px;
|
background: #fafafa;
|
border: 1px solid #e6e6e6;
|
}
|
|
.coreshop-f8 { background-color: #F8F8F8; }
|
.coreshop-ff { background-color: #ffffff; }
|
.core-opa{
|
opacity: 0;
|
}
|
|
/*字体高度*/
|
.chuany-line-height-initial { line-height: initial }
|
|
/*人民币符号*/
|
.chuany-text-price::before { content: "¥"; font-size: 80%; margin-right: 2px; }
|
|
/*字体格式*/
|
.chuany-text-bold { font-weight: bold; }
|
.chuany-family-roman{font-family:'Times New Roman', Times, serif}
|
.chuany-font12 { font-size: 12px; }
|
.chuany-font13 { font-size: 13px; }
|
.chuany-font14 { font-size: 14px; }
|
.chuany-font15 { font-size: 15px; }
|
.chuany-font17 { font-size: 17px; }
|
|
.chuany-flex-nowrap { flex-wrap: nowrap; }
|
|
.chuany-text-left { text-align: left; }
|
.chuany-text-center { text-align: center; }
|
.chuany-text-right { text-align: right; }
|
// 间距
|
.chuany-cursor{
|
cursor:pointer
|
}
|
//文字竖着
|
.vertical-text {
|
writing-mode: vertical-rl; /* 文字从上到下，从右到左 */
|
transform: rotate(0deg); /* 可选，使文字正面朝上 */
|
padding: 10px 4px;
|
}
|
// 间距
|
// 定义字体(px)单位
|
@for $i from 0 through 40 {
|
.chuany-line#{$i} { line-height: $i; }
|
}
|
@for $i from 0 through 100 {
|
.chuany-width#{$i} { width:$i + #{'%'}; }
|
}
|
// 定义字体(px)单位
|
@for $i from 0 through 100 {
|
.chuany-font#{$i} { font-size: $i + rpx; }
|
}
|
|
//圆角
|
@for $i from 0 through 40 {
|
.chuany-bradius#{$i} { border-radius: $i + rpx; }
|
}
|
|
|
|
|
// 定义内外边距，历遍1-200
|
@for $i from 0 through 200 {
|
// 只要双数和能被5除尽的数
|
@if $i % 2 == 0 or $i % 5 == 0 {
|
// 得出：coreshop-margin-30或者u-m-30
|
.chuany-margin#{$i}, .c-m-#{$i} { margin: $i + rpx !important; }
|
|
// 得出：coreshop-padding-15或者u-p-30
|
.chuany-padding#{$i}, .c-p-#{$i} { padding: $i + rpx !important; }
|
|
@each $short, $long in l left, t top, r right, b bottom {
|
// 缩写版，结果如： u-m-l-30
|
// 定义外边距
|
.c-m-#{$short}-#{$i} { margin-#{$long}: $i + rpx !important; }
|
|
// 定义内边距
|
.c-p-#{$short}-#{$i} { padding-#{$long}: $i + rpx !important; }
|
|
// 完整版，结果如：coreshop-margin-left-30
|
// 定义外边距
|
.chuany-margin#{$long}-#{$i} { margin-#{$long}: $i + rpx !important; }
|
|
// 定义内边距
|
.chuany-padding#{$long}-#{$i} { padding-#{$long}: $i + rpx !important; }
|
}
|
}
|
}
|
