purely according to the example of the official website, there has always been a magnifying effect. (I have changed initial-scale, and set zoomFactor, but the setting of initial-scale is 1.0 (ZoomFactor) has also been reset)
index.js (copy the official website example, only devtool, is not opened and zoomFactor setting is added)
const {
app,
BrowserWindow
} = require("electron"),
electron = require("electron"),
Menu = electron.Menu
// Keep a global reference of the window object, if you don"t, the window will
// be closed automatically when the JavaScript object is garbage collected.
let win
function createWindow() {
//
Menu.setApplicationMenu(null)
//
win = new BrowserWindow({
webPreferences: {
zoomFactor: 1
},
width: 200,
height: 200
})
// index.html
win.loadFile("index.html")
//
// win.webContents.openDevTools()
// window
win.on("closed", () => {
// window
// window
//
win = null
})
}
// Electron
//
// API ready
app.on("ready", createWindow)
//
app.on("window-all-closed", () => {
// macOS Cmd + Q
//
if (process.platform !== "darwin") {
app.quit()
}
})
app.on("activate", () => {
// macOSdock
//
if (win === null) {
createWindow()
}
})
//
// require
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
p {
color: red;
font-size: 30px;
}
</style>
</head>
<body>
hi
</body>
</html>the effect is as follows (the window size is indeed 20000200, no problem):
font is obviously much more than 30 pixels.