html, body { width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; } /* ------ START 滚动条美化 ------ */ /* 滚动条整体部分,其中的属性有width,height,background,border等(就和一个块级元素一样)(位置1) */ ::-webkit-scrollbar { width: 0px; height: 0px; } /* 滚动条两端的按钮,可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果(位置2) */ /* ::-webkit-scrollbar-button{ background:#74D334; }*/ ::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb { border-radius: 999px; border: 5px solid transparent; } /* 外层轨道,可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果(位置3) */ ::-webkit-scrollbar-track { box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset; display: none; } /* 内层轨道,滚动条中间部分(位置4) */ /*::-webkit-scrollbar-track-piece{ background:#FF66D5; }*/ /*滚动条里面可以拖动的那部分(位置5)*/ ::-webkit-scrollbar-thumb { min-height: 20px; background-clip: content-box; /*box-shadow: 0 0 0 5px rgba(0,0,0,.2) inset;*/ box-shadow: 0 0 0 5px #e1e1e1 inset; } /*边角(位置6)*/ ::-webkit-scrollbar-corner { background: transparent; } /**全局的路由样式*/ .router-container { width: 100%; transition: all 0.3s ease; overflow: hidden; } /**页面进入动画*/ .switch-left-enter, .switch-right-leave-active { position: absolute; top: 0; -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } /**页面离开动画*/ .switch-left-leave-active, .switch-right-enter { position: absolute; top: 0; -webkit-transform: translate(-100%, 0) !important; transform: translate(-100%, 0) !important; } /**页面另外一种入场方式*/ .slide-left-enter,.slide-right-leave-active { position: absolute; top:0; -webkit-transform: translate(100%, 0); transform: translate(100%, 0); z-index: 9999999; } .slide-right-enter,.slide-left-leave-active { position: absolute; top:0; -webkit-transform: translate(0%, 0); transform: translate(0%, 0); } .d-page { position: relative; width: 100%; height: 100%; background-color: white; } .wh-100 { width: 100%; height: 100%; } /**盒布局中让子组件的比重为1*/ .flex-1-dhc{ flex: 1; -webkit-box-flex: 1; -webkit-flex: 1; } /**鼠标的形状为手型*/ .cursor-pointer-dhc{ cursor: pointer; user-select: none; } /**文字不折行*/ .no-warp-dhc { white-space: nowrap !important; } a, button, li { user-select: none; } a:active, button:active { opacity: 0.6; } /** 自定义表单 **/ .d-form-field { display: flex; align-items: center; padding: 0 1rem 1.5rem 1rem; .van-field { padding: 0; width: auto; flex: 1; } .van-field__label { font-size: 16px; padding: 6px 0; span { width: 100%; } } .van-field__body { padding: 6px 0; } .van-field__control { font-size: 14px; padding: 0 5px; } .field-border { .van-field__body { border: 1px solid #dddddd; border-radius: 2px; } } .van-field.field-large { .van-field__body, .van-field__label { padding: 8px 0; } .van-field__label, .van-field__control { font-size: 18px; } } .van-field.field-small { .van-field__body, .van-field__label { padding: 4px 0; } .van-field__label, .van-field__control { font-size: 14px; } } .van-field--disabled { .van-field__body { background: #f5f5f5; } } .van-cell--required:before { display: none; } .van-cell--required { .van-field__label { padding-right: 6px; } .van-field__body:before { position: absolute; height: 16px; content: "*"; font-size: 20px; color: red; left: -16px; top: 4px; } } } .v-scroller { overflow-y: auto; } .h-scroller { overflow-x: auto; } .information-container{ padding-left: 32px; padding-right: 240px; .van-index-anchor { color: #333333; padding: 0; } .van-index-bar__sidebar { position: absolute; top: 350px; right: 32px; padding: 16px 0; border-left: 1px solid #adb5bd; } .van-index-bar__sidebar > * { width: 180px; line-height: 25px; font-size: 16px; text-align: left; color: #999999; padding: 10px 0 10px 32px; } .van-index-bar__index { position: relative; } .van-index-bar__index--active { font-size: 18px; } .van-index-bar__index:first-child:after, .van-index-bar__index:last-child:after, .van-index-bar__index:before, .van-index-bar__index--active:before { position: absolute; width: 28px; height: 100%; content: " "; left: -15px; background-position: center; background-repeat: no-repeat; } .van-index-bar__index:before { top: 0; background-image: url("../svg/cursor-index.svg"); } .van-index-bar__index--active:before { background-image: url("../svg/cursor-active.svg"); } .van-index-bar__index:first-child:after { height: 28px; top: -44px; background-image: url("../svg/cursor-tag.svg"); } .van-index-bar__index:last-child:after { height: 28px; bottom: -44px; background-image: url("../svg/cursor-tag.svg"); } } .customer-management-information-form { width: 100%; margin-top: 2%; margin-bottom: 3%; } .customer-management-information-form > tr:nth-child(odd) { background-color: #f7fafc; } .customer-management-information-form tr td { text-align: center; font-family: "Arial Normal", "Arial"; color: #333333; font-size: 16px; line-height: 20px; padding: 1% 5px; } .customer-management-information-form > tr:nth-child(1) td { font-size: 14px; padding: 1% 10px; color: #999999; } .customer-management-information-form > tr:nth-child(1) { background-color: #f2f2f2; font-weight: bold; } .customer-management-information-form tr { height: 46px; line-height: 46px; } .customer-management-information-form-title { display: flex; justify-content: flex-start; align-items: center; } .customer-management-information-form-title > div:nth-child(2) { font-size: 18px; color: #00000099; font-weight: bold; font-family: "Arial Normal", "Arial"; } .customer-management-information-form-title > div:nth-child(1) { width: 8px; height: 8px; margin-right: 1.5%; border-radius: 4px; background-color: rgba(247, 148, 0, 0.4); } .customer-management-information-content{ width: 97%; margin: 0 auto; } .customer-information-master-label { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 2%; } .customer-information-master-label > div:nth-child(1) { width: 0.595%; padding-top: 1.99%; border-radius: 3px; margin-right: 1%; background-color: rgba(247, 148, 0, 0.4); } .customer-information-master-label > div:nth-child(2) { font-size: 129%; font-weight: bold; padding-top: 0.25%; } .header-information, .header-information-left, .header-information-right { display: flex; justify-content: space-between; align-items: center; } .header-information-left div, .header-information-right div { margin: 0 5%; font-size: 16px; color: #00000099; font-family: "Arial Normal", "Arial"; } .header-information-left { width: 40%; } .header-information-right { width: 34%; } .customer-data-list { border: 1px solid #e1e2e3; padding: 10px 20px; margin-bottom: 10px; } .data-title { font-weight: bold; margin-bottom: 10px; font-size: 16px; } .flow-y-dhc { overflow-x: hidden !important; overflow-y: auto !important; }