| | |
| | | <template> |
| | | <div id="app" class="app app1"> |
| | | <!-- vue router |
| | | axios |
| | | less |
| | | vuex |
| | | vuels --> |
| | | <!-- <demo/> --> |
| | | <!-- <div id="nav"> |
| | | <router-link to="/">Home</router-link> |
| | | <router-link to="/about">About</router-link> |
| | | </div> |
| | | <router-view/> --> |
| | | |
| | | <!-- 将上传组件全局注册 --> |
| | | <!-- <global-uploader></global-uploader> --> |
| | | <pp></pp> |
| | | <div id="app" class="app"> |
| | | <router-view class=""></router-view> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import globalUploader from '@/components/globalUploader.vue' |
| | | import HelloWorld from '@/components/HelloWorld.vue' |
| | | import demo from '@/components/demo.vue' |
| | | // import pp from '@/components/test1/parent1.vue' |
| | | import pp from '@/components/layouts/test.vue' |
| | | |
| | | export default { |
| | | name: 'app', |
| | | components: {}, |
| | | data() { |
| | | return {} |
| | | }, |
| | | components: { |
| | | globalUploader, |
| | | HelloWorld, |
| | | demo, |
| | | pp |
| | | |
| | | }, |
| | | components: {}, |
| | | computed: {}, |
| | | created() {}, |
| | | watch: {}, |
| | | methods: {} |
| | | } |
| | | </script> |
| | | <style> |
| | | .app { |
| | | overflow: auto; |
| | | border: none; |
| | | |
| | | |
| | | <style lang="less"> |
| | | body { |
| | | background: #f0f2f5; |
| | | } |
| | | |
| | | #app,body,html { |
| | | height: 100%; |
| | | |
| | | .ant-modal-header { |
| | | //ant 弹窗移动样式 |
| | | cursor: move; |
| | | } |
| | | |
| | | .scrollbar { |
| | | |
| | | @font-face { |
| | | font-family: 'HYTangMeiRen'; |
| | | // font-display: swap; |
| | | src: url("http://t.inleft.com/share/z%E5%AD%97%E4%BD%93%E5%BA%93/hytmr55%E6%B1%89%E4%BB%AA%E5%94%90%E7%BE%8E%E4%BA%BA%E5%AD%97%E4%BD%93.woff") format("truetype"); |
| | | } |
| | | |
| | | span, |
| | | p, |
| | | a, |
| | | body, |
| | | h1, |
| | | h2, |
| | | h3, |
| | | h4, |
| | | h5, |
| | | h6, |
| | | code, |
| | | pre{ |
| | | font-family: HYTangMeiRen !important; |
| | | } |
| | | |
| | | #app { |
| | | // overflow: auto; |
| | | // border: none; |
| | | } |
| | | |
| | | /* .scrollbar { |
| | | margin: 0 auto; |
| | | } |
| | | |
| | | .app1::-webkit-scrollbar { |
| | | } */ |
| | | ::-webkit-scrollbar { |
| | | /*滚动条整体样式*/ |
| | | /*高宽分别对应横竖滚动条的尺寸*/ |
| | | width: 8px; |
| | | height: 5px; |
| | | height: 8px; |
| | | /*高宽分别对应横竖滚动条的尺寸*/ |
| | | } |
| | | |
| | | .app1::-webkit-scrollbar-thumb { |
| | | ::-webkit-scrollbar-thumb { |
| | | /*滚动条里面小方块*/ |
| | | border-radius: 6px; |
| | | background: #aaa; |
| | | } |
| | | |
| | | .app1::-webkit-scrollbar-track { |
| | | ::-webkit-scrollbar-track { |
| | | /*滚动条里面轨道*/ |
| | | border-radius: 8px; |
| | | background: #FFFFFF; |
| | | margin-top: 20px; |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | a { |
| | | position: relative; |
| | | } |
| | | |
| | | a:hover:after { |
| | | left: 0; |
| | | width: 100%; |
| | | -webkit-transition: width 350ms; |
| | | -moz-transition: width 350ms; |
| | | -ms-transition: width 350ms; |
| | | -o-transition: width 350ms; |
| | | transition: width 350ms; |
| | | } |
| | | |
| | | a:after { |
| | | position: absolute; |
| | | bottom: -0.0625rem; |
| | | left: 100%; |
| | | width: 0; |
| | | border-bottom: 0.0625rem solid #30a9de; |
| | | content: ""; |
| | | -webkit-transition: width 350ms, left 350ms; |
| | | -moz-transition: width 350ms, left 350ms; |
| | | -ms-transition: width 350ms, left 350ms; |
| | | -o-transition: width 350ms, left 350ms; |
| | | transition: width 350ms, left 350ms; |
| | | } |
| | | |
| | | .fade-enter-active, |
| | | .fade-leave-active { |
| | | transition: opacity .5s; |
| | | } |
| | | |
| | | .fade-enter, |
| | | .fade-leave-to { |
| | | opacity: 0; |
| | | } |
| | | </style> |