*{
box-sizing: border-box;
}
page,
view,
scroll-view,
swiper,
button,
input,
textarea,
label,
navigator,
image {
box-sizing: border-box;
}
image {
max-width: 100%;
display: inline-block;
position: relative;
z-index: 0;
}
.over_hidden{
overflow: hidden;
}
.contant{
box-sizing: border-box;
}
.text_left{
text-align: left;
}
.text_right{
text-align: right;
}
.text_center{
text-align: center;
}
/* 单行文字超出显示省略号 */
.text_overflow{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
/* 多行文字超出显示省略号 */
.text_2overflow{
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.gradient_ff1a2f{
background: -moz-linear-gradient(left, #ff8057 0%, #ff1a2f 100%);
background: -webkit-gradient(linear, left, right, color-stop(0%,#ff8057), color-stop(100%,#ff1a2f));
background: -webkit-linear-gradient(left, #ff8057 0%,#ff1a2f 100%);
background: -o-linear-gradient(left, #ff8057 0%,#ff1a2f 100%);
background: -ms-linear-gradient(left, #ff8057 0%,#ff1a2f 100%);
background: linear-gradient(to right, #ff8057 0%,#ff1a2f 100%);
}
.gradient_hei{
background: -moz-linear-gradient(left, #454545 0%, #191919 100%);
background: -webkit-gradient(linear, left, right, color-stop(0%,#454545), color-stop(100%,#191919));
background: -webkit-linear-gradient(left, #454545 0%,#191919 100%);
background: -o-linear-gradient(left, #454545 0%,#191919 100%);
background: -ms-linear-gradient(left, #454545 0%,#191919 100%);
background: linear-gradient(to right, #454545 0%,#191919 100%);
}
.gradient_huang{
background: -moz-linear-gradient(left, #fde2b3 0%, #fed185 100%);
background: -webkit-gradient(linear, left, right, color-stop(0%,#fde2b3), color-stop(100%,#fed185));
background: -webkit-linear-gradient(left, #fde2b3 0%,#fed185 100%);
background: -o-linear-gradient(left, #fde2b3 0%,#fed185 100%);
background: -ms-linear-gradient(left, #fde2b3 0%,#fed185 100%);
background: linear-gradient(to right, #fde2b3 0%,#fed185 100%);
}
.gradient_lan{
background: -moz-linear-gradient(left, #366cb3 0%, #4690f1 100%);
background: -webkit-gradient(linear, left, right, color-stop(0%,#366cb3), color-stop(100%,#4690f1));
background: -webkit-linear-gradient(left, #366cb3 0%,#4690f1 100%);
background: -o-linear-gradient(left, #366cb3 0%,#4690f1 100%);
background: -ms-linear-gradient(left, #366cb3 0%,#4690f1 100%);
background: linear-gradient(to right, #366cb3 0%,#4690f1 100%);
}
/* 弹性布局 */
.dis_flex{
display: flex;
}
.dis_sb{
justify-content: space-between;
}
.dis_center{
justify-content: center;
}
.dis_around{
justify-content: space-around;
}
.dis_start{
justify-content: flex-start;
}
.dis_end{
justify-content: flex-end ;
}
.align_center{
align-items: center;
}
.flex_wrap{
flex-wrap:wrap ;
}
.dis_flex1{
flex: 1;
}
.flex_nowrap{
flex-wrap:nowrap;
}
/* 圆角 */
.b_radius50{
border-radius: 50%;
}
.b_radius20px{
border-radius: 20rpx;
}
.b_radius44px{
border-radius: 44rpx;
}
/* 背景色 */
.bg_468ff1{
background-color: #468ff1;
}
.bg_fc5c2f{
background-color: #fc5c2f;
}
.bg_white{
background-color: #FFFFFF;
}
.bg_f0f0f0{
background-color: #f0f0f0;
}
.bg_999999{
background-color: #999999;
}
.bg_ff003b{
background-color: #ff003b;
}
.bg_366CB3{
background-color: #366CB3;
}
/* 字体大小 */
.font_weight{
font-weight: bold;
}
.font_s36{
font-size: 36rpx;
}
.font_s32{
font-size: 32rpx;
}
.font_s30{
font-size: 30rpx;
}
.font_s28{
font-size: 28rpx;
}
.font_s26{
font-size: 26rpx;
}
.font_s24{
font-size: 24rpx;
}
.font_s22{
font-size: 22rpx;
}
.font_s20{
font-size: 20rpx;
}
.font_s18{
font-size: 18rpx;
}
.font_s16{
font-size: 16rpx;
}
/* 字体颜色 */
.text_ff8057{
color: #ff8057;
}
.text_366cb3{
color: #366cb3;
}
.text_fedd02{
color:#fedd02;
}
.text_666666{
color:#666666;
}
.text_bb3430{
color: #bb3430;
}
.text_c1c1c1{
color:#c1c1c1;
}
.text_333333{
color:#333333;
}
.text_222222{
color:#222222;
}
.text_ff1c30{
color: #ff1c30;
}
.text_ff003b{
color:#ff003b;
}
.text_bb3430{
color: #bb3430;
}
.text_999999{
color:#999999;
}
.text_white{
color: #FFFFFF;
}
.text_0cba7a{
color:#0cba7a;
}
.text_179fee{
color: #179fee;
}
/* 边距 */
.margin0_auto{
margin: 0 auto;
}
.margin_right30{
margin-right: 30rpx;
}
.margin_sx20{
margin-top: 20rpx;
margin-bottom: 20rpx;
}
.margin_sx30{
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.margin_zy30{
margin-left: 30rpx;
margin-right: 30rpx;
}
.margin_zy20{
margin-left: 20rpx;
margin-right: 20rpx;
}
.margin_zy10{
margin-left: 10rpx;
margin-right: 10rpx;
}
.margin_30{
margin:30rpx;
}
.margin_top30{
margin-top: 30rpx;
}
.margin_top20{
margin-top: 20rpx;
}
.margin_top10{
margin-top: 10rpx;
}
.margin_bottom10{
margin-bottom: 10rpx;
}
.margin_bottom20{
margin-bottom: 20rpx;
}
.margin_bottom30{
margin-bottom: 30rpx;
}
.margin_right20{
margin-right: 20rpx;
}
.margin_z100{
margin-left: 100rpx;
}
.margin0{
margin:0;
}
.padding_top54{
padding-top: 54rpx;
}
.padding_top20{
padding-top: 20rpx;
}
.padding_top30{
padding-top: 30rpx;
}
.padding_zy22{
padding-left: 22rpx;
padding-right: 22rpx;
}
.padding_sx30{
padding-top: 30rpx;
padding-bottom: 30rpx;
}
.padding_bottom20{
padding-bottom: 20rpx;
}
.padding_bottom30{
padding-bottom: 30rpx;
}
.padding_right10{
padding-right: 10rpx;
}
.padding_sx10{
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.padding_sx20{
padding-top: 20rpx;
padding-bottom: 20rpx;
}
.padding_zy30{
padding-left: 30rpx;
padding-right: 30rpx;
}
.padding_zy62{
padding-left: 66rpx;
}
.padding_zy20{
padding-left: 20rpx;
padding-right: 20rpx;
}
.padding_zy10{
padding-left: 10rpx;
padding-right: 10rpx;
}
.padding0{
padding:0;
}
.padding_20{
padding: 20rpx;
}
.padding_30{
padding: 30rpx;
}
.padding_10{
padding: 10rpx;
}
.padding_l10{
padding-left: 2rpx;
}
/* 宽高 */
.width_720rpx{
width:690rpx;
}
.width_15{
width:15%;
}
.width_20{
width:20%;
}
.width_70{
width:70%;
}
.width_50{
width:50%;
}
.width_60{
width:60%;
}
.width_40{
width:40%;
}
.width_30{
width:30%;
}
.width_100{
width:100%;
}
.height_100{
height:100%;
}
/* 边框 */
.border_bottome1e1e1{
border-bottom:1rpx solid #e1e1e1;
}
.border_tope1e1e1{
border-top:1rpx solid #e1e1e1;
}
.border_e1e1e1{
border:1rpx solid #e1e1e1;
}
.border_ff003b{
border:1rpx solid #ff003b;
}
.border_366cb3{
border:1rpx solid #366cb3;
}
/* 行高 */
.line_height50{
line-height: 50rpx;
}
/* 边框阴影 */
.b_shadow{
box-shadow: 3px 4px 20rpx 1rpx #bfb3b3;
}
/* -- flex弹性布局 -- */
.flex {
display: flex;
}
.flex_inline {
display:inline-flex;
}
.basis-sxs {
flex-basis: 10%;
}
.basis-xs {
flex-basis: 20%;
}
.basis-30 {
flex-basis: 30%;
}
.basis-sm {
flex-basis: 40%;
}
.basis-df {
flex-basis: 50%;
}
.basis-lg {
flex-basis: 60%;
}
.basis-70 {
flex-basis: 70%;
}
.basis-xl {
flex-basis: 80%;
}
.flex-sub {
flex: 1;
}
.flex-twice {
flex: 2;
}
.flex-treble {
flex: 3;
}
.flex-direction {
flex-direction: column;
}
.flex-wrap {
flex-wrap: wrap;
}
.align-start {
align-items: flex-start;
}
.align-end {
align-items: flex-end;
}
.align-center {
align-items: center;
}
.align-stretch {
align-items: stretch;
}
.self-start {
align-self: flex-start;
}
.self-center {
align-self: flex-center;
}
.self-end {
align-self: flex-end;
}
.self-stretch {
align-self: stretch;
}
.align-stretch {
align-items: stretch;
}
.justify-start {
justify-content: flex-start;
}
.justify-end {
justify-content: flex-end;
}
.justify-center {
justify-content: center;
}
.justify-between {
justify-content: space-between;
}
.justify-around {
justify-content: space-around;
}
/* 定位 */
.display_IB{
display: inline-block;
}
.position_R{
position: relative;
}
.position_A{
position: absolute;
}
.position_F{
position: fixed;
}
.position_S{
position: sticky;
}
/* 浮动 */
.fl{
float: left;
}
.fr{
float: right;
}
.cl{
clear: both;
}
/* 船货帮项目主题色 */
.chb_liner{
background-image: linear-gradient(90deg,
#179fee 0%,
#47e7ff 100%);
}
.chb_bg_179fee{
background-color: #179fee;
}
.chb_bg_f8{
background-color: #f8f8f8;
}