/** * nth-tabs * author:nethuige * version:2.0 */ .nth-tabs { color: #fff; font-family: "Helvetica Neue",Helvetica,Tahoma,Arial,"Microsoft Yahei","Hiragino Sans GB","WenQuanYi Micro Hei",sans-serif; } .nth-tabs .page-tabs { width: 100%; height: 50px; } .nth-tabs .content-tabs { width: 100%; height: 50px; /* background: #fafafa; */ overflow: hidden; } .nth-tabs .content-tabs-container { width: 500%; margin-left: 40px; overflow: hidden; height: 50px; transition: margin-left 1s; -moz-transition: margin-left 1s; -webkit-transition: margin-left 1s; -o-transition: margin-left 1s; } .tab-content{ overflow: auto; } .nth-tabs,.tab-content,.tab-pane{ height: 100%; /*height: calc(100% - 42px);*/ } .nth-tabs-content{ width:100%; height: 100%; /*height: calc(100% - 42px);*/ position: relative; overflow-x: hidden; } .nth-tabs-frame{ width:100%; height: 100%; /*height: calc(100% - 42px);*/ position: relative; overflow-x: hidden; } /*选项卡操作相关*/ .nth-tabs .roll-nav { color: #fff; position: absolute; width: 40px; height: 50px; text-align: center; z-index: 2; top: 0; padding-top:15px; border-left: 1px solid #797979; } .nth-tabs a.roll-nav:hover { color: #000 !important; background-color: #fff; } .nth-tabs a.roll-nav:active,.nth-tabs a.roll-nav:visited { color: #95A0AA; } .nth-tabs .roll-nav-left { /* left: 0; border-bottom: 1px solid #E4EAEC;*/ } .nth-tabs .roll-nav-right { right: 40px; /* border-bottom: 1px solid #E4EAEC; */ } .nth-tabs .tab-close { /* position: absolute; top: 17px; right: 10px; */ width: 16px; height: 16px; text-align: center; line-height: 16px; color: #333; } .nth-tabs .tab-close:hover { background-color: #f96868; border-radius: 16px; color: #fff; cursor: pointer; } .nth-tabs .tab-down{ /* border-top: 4px solid; -webkit-transition: .25s; -o-transition: .25s; transition: .25s; -webkit-transform: scale(1.001); -ms-transform: scale(1.001); -o-transform: scale(1.001); transform: scale(1.001); display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; */ } /*tab list*/ .nth-tabs .right-nav-list { right: 0; /*border-left: 1px solid #E4EAEC;*/ /* border-bottom: 1px solid #E4EAEC; */ } .nth-tabs .right-nav-list a { padding:12px 12px 15px 12px; color: #fff; } .nth-tabs .right-nav-list a:hover { color: #000 !important; background-color: #fff; } .tab-list-scrollbar { max-height: 250px; max-width: 180px; } .dropdown-menu{ background-color:#262832 !important; z-index: 99999999 !important; left: -141px !important; } .dropdown-menu ul { list-style: none; margin: 0px; text-align: left; padding: 0px; } .dropdown-menu ul li { line-height: 30px; padding: 0px 20px; white-space: nowrap; } .dropdown-menu ul li:hover { background-color: #ececec; cursor: pointer; } .scrollbar-outer { overflow: hidden; } /*重写tab*/ .nav-tabs { /* background-color: #FFFFFF; */ min-height:50px; margin:0px; float:left; } .nav-tabs a { color: #76838f; border-radius: 0; } .nav-tabs>li{ /* width:8.1em; */ margin:0; } .nav-tabs>li>a { padding:13px; text-align: center; min-height:50px; } .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover { border:1px solid transparent; background-color: #FFA14F !important; color: #fff; cursor: pointer; -webkit-transition-property: background-color,border-bottom; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; -moz-transition-property: background-color,border-bottom; -moz-transition-duration: 0.2s; -moz-transition-timing-function: ease; -o-transition-property: background-color,border-bottom; -o-transition-duration: 0.2s; -o-transition-timing-function: ease; } .nav>li>a:focus, .nav>li>a:hover { background-color: #F3F7F9; } /*animation*/ [class*=animation-] { -webkit-animation-duration: .5s; -o-animation-duration: .5s; animation-duration: .5s; -webkit-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } .animation-fade { -webkit-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: .8s; -o-animation-duration: .8s; animation-duration: .8s; -webkit-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; }