zh_order_food_xcx/common/css/common.css

body {
  background-color: #F5F5F5;
}
view,text {
  font-size: 24rpx;
  color: #333;
}
image {
  display: block;
}


/* 隐藏scroll-view 滚动条 */
::-webkit-scrollbar {
  display: none;
}

.iPhone-bottom {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}
/* 不换行 */
.view-nowrap{
	white-space: nowrap;
}

/* 自动换行 */
.view-word-wrap{
	white-space: pre-wrap;
	word-wrap: break-word;
}
/*超出三行... */
.text-overflow-ellipsis-t {
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	white-space: pre-wrap;
	word-wrap: break-word;
}

/*超出两行... */
.text-overflow-ellipsis {
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	white-space: pre-wrap;
	word-wrap: break-word;
}

/*超出一行... */
.text-overflow-ellipsis-one {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	word-break: break-all;
}
/* 内部盒子 */
.box-border-box{
	box-sizing: border-box;
}

.flex-common-css {
	width: 100%;
	height: 100vh;
	display: flex;
	flex-direction: column;
}
.flex-index-css {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.flex-direction {
  display: flex;
  flex-direction: column;
}
.display-flex {
	display: flex;
}
.flex-justify-space {
	display: flex;
	justify-content: space-between;
}

.flex-justify-around {
	display: flex;
	justify-content: space-around;
}

.flex-justify-center {
	display: flex;
	justify-content: center;
}
.flex-justify-end {
	display: flex;
	justify-content: flex-end;
}
.flex-justify-start {
	display: flex;
	justify-content: flex-start;
}
.align-items-center {
	display: flex;
	align-items: center;
}
.align-items-flex-end {
	display: flex;
	align-items: flex-end;
}
.flex-wrap-wrap {
	display: flex;
	flex-wrap: wrap;
}
.common-view-css{
	width: 100%;
	flex: 1;
}
.scroll-view-css {
	width: 100%;
	flex: 1;
	overflow: auto;
}
.box-sizing-border {
	box-sizing: border-box;
}
.text-align-center {
	text-align: center;
}
.text-align-right {
	text-align: right;
}
.text-align-left {
	text-align: left;
}
.flex-1{
	flex: 1;
}
.flex-shrink0{
	flex-shrink: 0;
}

/* 字体大小 */
.fs-20{
	font-size: 20rpx;
}
.fs-22{
	font-size: 22rpx;
}
.fs-24{
	font-size: 24rpx;
}
.fs-26{
	font-size: 26rpx;
}
.fs-28{
	font-size: 28rpx;
}
.fs-30{
	font-size: 30rpx;
}
.fs-32{
	font-size: 32rpx;
}
.fs-34{
	font-size: 34rpx;
}
.fs-48{
	font-size: 48rpx;
}

/* 字体下面横线 */
.text-underline{
	text-decoration: underline;
}
/* 字体中间横线 */
.text-line-through{
	text-decoration:line-through
}

/* 字体粗细 */
.fw-b{
	font-weight: bold;
}
.fw-400{
	font-weight: 400;
}
.fw-500{
	font-weight: 500;
}
.fw-600{
	font-weight: 600;
}

/* 字体颜色 */
.fc-f{
	color: #fff;
}
.fc-0{
	color: #000;
}
.fc-3{
	color: #333;
}
.fc-6{
	color: #666;
}
.fc-9{
	color: #999;
}
.fc-41ABF5{
	color: #41ABF5;
}
.fc-FB3D03{
	color: #FB3D03;
}
.fc-FF7F00{
	color: #FF7F00;
}
.fc-41ABF5{
	color: #41ABF5;
}

/* 背景颜色 */
.bgc-f{
	background-color: #fff;
}
.bgc-3{
	background-color: #333;
}
.bgc-9{
	background-color: #999;
}
.bgc-41ABF5{
	background-color: #41ABF5;
}
.bgc-FCE7E2{
	background-color: #FCE7E2;
}
.bgc-E6E6E6{
	background-color: #E6E6E6;
}


/* 圆角 */
.b-rad-20{
	border-radius: 20rpx;
}


/* 内边距 */
.p-8{
	padding: 8rpx;
}
.p-24{
	padding: 24rpx;
}
.p-t-10 {
	padding-top: 10rpx;
}
.p-b-20 {
	padding-bottom: 20rpx;
}
.plr-12{
	padding: 0 12rpx;
}
.plr-24{
	padding: 0 24rpx;
}


/* 外边距 */
.m-24{
	margin: 24rpx;
}

.ml-10{
	margin-left: 10rpx;
}



.mr-8{
	margin-right: 8rpx;
}
.mr-12{
	margin-right: 12rpx;
}
.mr-24{
	margin-right: 24rpx;
}




.mb-4{
	margin-bottom: 4rpx;
}
.mb-8{
	margin-bottom: 8rpx;
}
.mb-12{
	margin-bottom: 12rpx;
}
.mb-18{
	margin-bottom: 18rpx;
}
.mb-20{
	margin-bottom: 20rpx;
}
.mb-22{
	margin-bottom: 22rpx;
}
.mb-24{
	margin-bottom: 24rpx;
}
.mb-32{
	margin-bottom: 32rpx;
}
.mb-64{
	margin-bottom: 64rpx;
}


/* 宽度 */
.w-100{
	width: 100rpx;
}
.w-200{
	width: 200rpx;
}
.w-10030{
	width: 30%;
}