用H5如何实现这种的效果

Question

想搞点花里胡哨的，看到某个平台的登录页面有这么个的背景图，感觉比我用的登录界面的背景图好多了，但是看了一番之后没找到这个是如何实现的，想过来问一下这个是怎么做到的这种效果

Answer 1

大概看了一下，就是一个正常的背景图片，不过背景尺寸固定，设置为相对较大

.login-container[data-v-227691be] {
    min-height: 100%;
    width: 100%;
    background-image: url(../../static/img/login-bg.eec69af1.png);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
    overflow: hidden;

背景图片地址为

https://hsjc.qingdao.gov.cn/static/img/login-bg.eec69af1.png

根据标签和样式得到的结果就是，当你的显示区域比例不同且小于最大设置时，显示区域有所不同