<script>
const baseSize = 16
function setRem() {
const scale = document.documentElement.clientWidth / 1920
console.log(document.documentElement.clientWidth);
document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'
if (document.documentElement.clientWidth === 3840) {
document.documentElement.style.fontSize = '24px'
}
}
setRem()
window.onresize = function () {
history.go(0);
setRem()
}
</script>
<template>
<div id="app">
<router-view></router-view>
</div>
</template>
<script>
const baseSize = 16
function setRem() {
const scale = document.documentElement.clientWidth / 1920
console.log(document.documentElement.clientWidth);
document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'
if (document.documentElement.clientWidth === 3840) {
document.documentElement.style.fontSize = '24px'
}
}
setRem()
window.onresize = function () {
history.go(0);
setRem()
}
export default {
name: 'App',
components: {
}
}
</script>
<style>
* {
margin: 0;
padding: 0;
}
@font-face {
font-family: 'Alibaba PuHuiTi-Bold';
src: url('@/assets/fonts/ALIBABA-PUHUITI-BOLD.TTF') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'PangMenZhengDao-3';
src: url('@/assets/fonts/庞门正道标题体3.0.TTF') format('truetype');
font-weight: bold;
font-style: normal;
}
// 滚动条样式
::-webkit-scrollbar {
width: 4px;
height: 4px;
}
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
border-radius: 999px;
border: 1px solid transparent;
}
::-webkit-scrollbar-track {
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset;
}
::-webkit-scrollbar-thumb {
min-height: 20px;
background-clip: content-box;
box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2) inset;
}
::-webkit-scrollbar-corner {
background: transparent;
}
</style>