在開發(fā)網(wǎng)站的過程中，我們常常會遇到需要縮放頁面的情況，如何實現(xiàn)頁面的同比例縮放呢？

可以使用CSS中的transform屬性完成該功能，具體代碼如下：

html {
/* 限定最小寬度 */
min-width: 100px;
/* 限定最大寬度 */
max-width: 800px;
/* 限定最小高度 */
min-height: 100px;
/* 限定最大高度 */
max-height: 800px;
/* 縮放 */
transform: scale(var(--scale));
/* 設(shè)置默認(rèn)縮放 */
--scale: 1;
}

上述代碼中，我們使用了CSS變量，其默認(rèn)值為1，表示頁面不進(jìn)行縮放。

當(dāng)我們需要進(jìn)行同比例縮放的時候，只需設(shè)置該變量的初始值，并在JavaScript中動態(tài)調(diào)整其值即可。

下面是使用JavaScript實現(xiàn)同比例縮放的代碼：

const scaleValue = 0.8; // 設(shè)置縮放比例
const htmlEl = document.querySelector('html');
htmlEl.style.setProperty('--scale', scaleValue);

上述代碼中，我們使用JavaScript獲取HTML元素中的CSS變量，并設(shè)置為指定的縮放比例。

這樣，頁面就可以實現(xiàn)同比例縮放的效果了。