zpj hai 1 ano
pai
achega
e4c00ae945
Modificáronse 2 ficheiros con 231 adicións e 0 borrados
  1. 1 0
      App.vue
  2. 230 0
      common/css/common.css

+ 1 - 0
App.vue

@@ -14,4 +14,5 @@
 
 <style>
 	/*每个页面公共css */
+	@import "./common/css/common";
 </style>

+ 230 - 0
common/css/common.css

@@ -0,0 +1,230 @@
+
+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;
+}
+/* 数字和文字不自动换行 */
+.overflowWrap{
+	overflowWrap:break-word;
+	word-break: break-all;
+}
+/* 自动换行 */
+.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-column {
+	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-start {
+	display: flex;
+	align-items: 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;
+}
+
+/* 字体粗细 */
+.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;
+}
+
+/* 背景颜色 */
+.bgc-f{
+	background-color: #fff;
+}
+.bgc-c{
+	background-color: #ccc;
+}
+.bgc-3{
+	background-color: #333;
+}
+.bgc-9{
+	background-color: #999;
+}
+
+
+
+
+/* 内边距 */
+
+.p-16{
+	padding: 16rpx;
+}
+.p-24{
+	padding: 24rpx;
+}
+.p-30{
+	padding: 30rpx;
+}
+.p-32{
+	padding: 32rpx;
+}
+
+/* 外边距 */
+.m-24{
+	margin: 24rpx;
+}
+