/* pages/takeBill/takeBill.wxss */ page { /* 拍摄框宽度 */ --w: 90vw; /* 拍摄框高度 */ --h: 85vh; /* 拍摄框上边距 */ --tg: 5vh } .back { background: #000; opacity: 0.5; } .fixed { position: fixed; } .top { top: 0; width: 100vw; height: var(--tg); } .right { right: 0; height: var(--h); width: calc((100vw - var(--w)) / 2); top: var(--tg); } .bottom { bottom: 0; width: 100vw; height: calc(100vh - var(--tg) - var(--h)); } .left { left: 0; height: var(--h); width: calc((100vw - var(--w)) / 2); top: var(--tg); } .dashed { height: var(--h); width: var(--w); top: var(--tg); left: calc((100vw - var(--w)) / 2); border: 4rpx dashed grey; } .text { top: 22vh; transform: rotate(90deg); transform-origin: left; left: 52vw; color: #fff; opacity: 0.7; font-size: 4vh; white-space: nowrap; } .out { height: calc((100vh - var(--tg) - var(--h)) / 2); width: calc((100vh - var(--tg) - var(--h)) / 2); border: 4rpx solid #fff; bottom: calc((100vh - var(--tg) - var(--h)) / 4); left: calc(50vw - (100vh - var(--tg) - var(--h)) / 4); border-radius: 50%; padding: 2rpx; display: flex; justify-content: center; align-items: center; } .in { width: 90%; height: 90%; background: #fff; border-radius: 50%; } .go-back { font-size: 2vh; color: #fff; bottom: calc((100vh - var(--tg) - var(--h)) / 3); right: calc((100vh - var(--tg) - var(--h)) / 2); }