（此處背景圖寬：高=1.92）

1.在html中設定兩種可選擇的類：

<divclass="login-container"v-bind:class="[{'cal-backgound-size-width':!calBgImage },{'cal-backgound-size-height' :calBgImage }]">

2.css樣式：

寬度自適應：

.cal-backgound-size-width{

background: url('/../../../static/bg.png') no-repeat;

background-size: auto100%;

}

高度自適應：

.cal-backgound-size-height

background: url('/../../../static/bg.png') no-repeat;

background-size: 100%auto;

}

3.js控制

mounted() {

this.calBgImage= (document.body.clientWidth/document.body.clientHeight) >1.92

// 然後監聽window的resize事件．在瀏覽器視窗變化時再設定下背景圖高度．

constthat=this

window.onresize=functiontemp() {

that.calBgImage= (document.body.clientWidth

}

},