body { background-image: url(bg.jpg); background-size: cover; /* 图片覆盖整个页面 */ background-position: center; /* 图片居中 */ background-repeat: no-repeat; /* 不重复 */ min-height: 100vh; margin: 0; padding: 0; display: flex; flex-direction: column; }
#canvas { flex: 1; display: flex; flex-direction: column; }
.common-bg { background-color: #4ca6ff; }
.toolbar { width: 100%; height: 45px; display: flex; justify-content: center; align-items: center; z-index: 1000; }
.divider { width: 100%; height: 10px; }
.tools { width: 400px; display: flex; justify-content: space-around; }
.page-txt { width: 26px; height: 16px; background-color: #fff; display: flex; justify-content: center; text-align: right; font-size: 18px; border-radius: 5px; }
.absolute { position: absolute; }
.flex { display: flex; }
.align-center { align-items: center; }
.pointer { cursor: pointer; }
.hide { display: none; }
.magazine-viewport { position: relative; width: 100%; flex: 1; display: flex; justify-content: center; align-items: center; padding: 20px 0; }
.container { position: relative; width: 80vw; height: 120vh; }
.magazine { position: relative; width: 80vw; height: 120vh; }
.footer { height: 30px; width: 100%; display: block; clear: both; }
.footer { line-height:30px; width: 100%; display: block; font-size:15px;clear: both; text-align:center; color:#FFF; background-color:#4ca6ff }
.logo { position: absolute; left: 10%; }

/* 屏幕宽度小于 480px 时应用 */
@media (max-width: 768px) {
body { font-size: 14px; }
}