123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333 |
- body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
- body, button, input, select, textarea {
- font-size:14px;
- color: #303133;
- font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -webkit-tap-highlight-color: transparent;
- }
- h1, h2, h3, h4, h5, h6{ font-size:100%; }
- address, cite, dfn, em, var { font-style:normal; }
- code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
- small{ font-size:12px; }
- ul, ol { list-style:none; }
- a { text-decoration:none; }
- a:hover { text-decoration:underline; }
- sup { vertical-align:text-top; }
- sub{ vertical-align:text-bottom; }
- legend { color:#000; }
- fieldset, img { border:0; }
- button, input, select, textarea { font-size:100%; }
- table { border-collapse:collapse; border-spacing:0; }
- .icon {
- width: 1em;
- height: 1em;
- vertical-align: -0.15em;
- fill: currentColor;
- overflow: hidden;
- }
- .boxMinHeight{
- min-height: calc(100vh - 110px);
- }
- .el-form-item__content{
- line-height:36px !important;
- }
- /* 盒子模型 */
- .flex-box {
- display: -webkit-box;
- display: -moz-box;
- display: -ms-flexbox;
- display: -webkit-flex;
- display: flex;
- }
- /*盒子模型,竖向自适应,垂直排列 */
- .flex-box-v {
- display: -webkit-box;
- display: -webkit-flex;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-flex-flow: column;
- flex-flow: column !important;
- }
- /*flex-box与 flex-v-ce结合*/
- .flex-box-ce {
- display: -webkit-box;
- display: -moz-box;
- display: -ms-flexbox;
- display: -webkit-flex;
- display: flex;
- align-items: center;
- -webkit-align-items: center;
- -webkit-box-align: center;
- }
- /* 水平等列排版(容器左右没缝隙,子元素左右两边自适应) */
- .flex-d-center {
- justify-content: space-between;
- -webkit-justify-content: space-between;
- }
- /* 水平等列排版(子元素两边有缝隙自己适应) */
- .flex-dv-center {
- justify-content: space-around;
- -webkit-justify-content: space-around;
- }
- /*水平,垂直居中 */
- .flex-center-center {
- justify-content: center;
- -webkit-justify-content: center;
- -moz-justify-content: center;
- align-items: center;
- -webkit-align-items: center;
- -webkit-box-pack: center;
- -webkit-box-align: center;
- -moz-align-items: center;
- -moz-box-pack: center;
- -moz-box-align: center;
- }
- /*对view中的子元素进行居中,并且位于容器的中间位置 水平居中 */
- .flex-v-zhu,
- .flex-h-zhu {
- justify-content: center;
- -webkit-justify-content: center;
- -webkit-box-pack: center;
- }
- /*对view中的子元素进行居中,并且位于容器的中间位置 垂直居中 */
- .flex-v-ce,
- .flex-h-ce {
- align-items: center;
- -webkit-align-items: center;
- -webkit-box-align: center;
- }
- /*让所有弹性盒模型对象的子元素都有相同的长度,且忽略它们内部的内容: */
- .flex-1 {
- -webkit-box-flex: 1;
- -moz-box-flex: 1;
- -webkit-flex: 1;
- -ms-flex: 1;
- flex: 1;
- }
- .flex-2 {
- -webkit-box-flex: 2;
- box-flex: 2;
- -moz-box-flex: 2;
- -webkit-flex: 2;
- -ms-flex: 2;
- flex: 2;
- }
- .flex-3 {
- -webkit-box-flex: 3;
- box-flex: 3;
- -moz-box-flex: 3;
- -webkit-flex: 3;
- -ms-flex: 3;
- flex: 3;
- }
- .flex-4 {
- -webkit-box-flex: 4;
- box-flex: 4;
- -moz-box-flex: 4;
- -webkit-flex: 4;
- -ms-flex: 4;
- flex: 4;
- }
- .flex-5 {
- -webkit-box-flex: 5;
- box-flex: 5;
- -moz-box-flex: 5;
- -webkit-flex: 5;
- -ms-flex: 5;
- flex: 5;
- }
- /* 水平反方向 */
- .flex-direction-row-reverse {
- flex-direction: row-reverse;
- -webkit-flex-direction: row-reverse;
- }
- /*超出部分用....表示的公用样式 */
- .font-flex-word {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- /* 内容超出部分自动换行 */
- .flex-d-wrap {
- flex-wrap: wrap;
- }
- /* 内容超出部分不换行 */
- .flex-no-wrap {
- flex-wrap: nowrap;
- }
- /* 从右边开始排列 */
- .flex-box-end {
- display: -webkit-box;
- display: -moz-box;
- display: -ms-flexbox;
- display: -webkit-flex;
- display: flex;
- justify-content: flex-end;
- }
- /* 字体颜色 */
- .blue {
- color: #26A2FF!important;
- }
- .red {
- color: #F56C6C!important;
- }
- .yellow {
- color: #E6A23C!important;
- }
- .green {
- color: #67C23A!important;
- }
- .fontColorB {
- color: #777777 !important;
- }
- .fontColorZ {
- color: #303133!important;
- }
- .fontColorF {
- color: #606266 !important;
- }
- .fontColorT {
- color: #C0C4CC!important;
- }
- /* 整体布局样式 */
- .all{
- background-color: #fff;
- border-radius: 5px;
- min-height:calc(100vh - 120px);
- min-width: 800px;
- position: relative;
- }
- .terr-left {
- width: 200px;
- box-sizing: border-box;
- padding: 20px 10px;
- max-height: 700px;
- overflow: auto;
- }
- .terr-left::-webkit-scrollbar {
- width: 3px;
- height: 3px;
- background-color: #fff;
- }
- .terr-left::-webkit-scrollbar-thumb {
- background-color: #D9D9D9;
- }
- .terr-right{
- padding: 20px;
- min-width: 600px;
- box-sizing: border-box;
- }
- .border-right:after {
- content: ' ';
- position: absolute;
- top: 0;
- left: 200px;
- bottom: 0;
- width: 1px;
- background: #ebeef5;
- }
- .border-right {
- /* position: relative; */
- }
- .padding-20{
- padding: 20px;
- }
- .margin-bottom{
- margin-bottom: 20px;
- }
- .diy-tip {
- margin-bottom: 10px !important;
- background: #f0f9eb !important;
- color: #67c23a !important;
- border: 1px solid #67c23a !important;
- padding:16px !important;
- min-width: 800px;
- border-radius: 4px;
- }
- .diy-tip p{
- color: #67c23a !important;
- }
- /* 分页样式 */
- .pagination{
- padding: 20px 0;
- text-align: center;
- }
- /* EL UI 重置 */
- .notifyBox{
- width: auto !important;
- }
- /* 级联选择器长度限制样式 */
- .el-cascader-menu .el-cascader-menu__wrap .el-scrollbar__view li.el-cascader-node {
- height: auto;
- max-width: 500px;
- }
- .el-cascader-menu .el-cascader-menu__wrap .el-scrollbar__view li.el-cascader-node .el-cascader-node__label {
- white-space: initial;
- overflow: initial;
- text-overflow: initial;
- }
- /* // 滚动条样式 */
- .scroll-bar{
- scroll-behavior: smooth
- }
- .scroll-bar::-webkit-scrollbar {
- width: 6px;
- height: 6px;
- }
- /*外层轨道。可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果*/
- .scroll-bar::-webkit-scrollbar-track {
- width: 6px;
- background-color: #fff0;
- -webkit-border-radius: 2em;
- -moz-border-radius: 2em;
- border-radius: 2em;
- }
- /*滚动条的设置*/
- .scroll-bar::-webkit-scrollbar-thumb {
- background-color: #fff0;
- background-clip: padding-box;
- -webkit-border-radius: 2em;
- -moz-border-radius: 2em;
- border-radius: 2em;
- }
- /*滚动条移上去的背景*/
- .scroll-bar:hover::-webkit-scrollbar-thumb {
- background-color: rgba(144, 147, 153, 0.3);
- height: 20px;
- }
|