所以我正在為一個基於electron的客戶端編寫退出按鈕，經過研究如何根據螢幕大小調整大小後，按鈕旁邊顯示了一個白色空白。當我嘗試將其移動到正確的位置時，它還在下面創建了一個巨大的白色框。有人知道為什麼會發生這種情況並能幫我解決嗎？
<body>
<webview src="https://bapbap.gg"></webview>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Archivo+Black">
<style>
body {
display: flex;
flex-direction: column;
margin: 0;
height: 100vh;
position: relative;
}
webview {
flex: 1;
}
.ExitButton {
cursor: pointer;
text-align: center;
font-size: 10px;
font-family: 'Archivo Black';
color: #6B7075;
border-color: transparent;
background-color: transparent;
transition-duration: 0.5s;
transform: translate(700px, 300px);
}
.ExitButton:hover {
background-color: rgb(150, 5, 5);
transition-duration: 0.5s;
}
.nav {
display: flex;
}
</style>
<div class="nav">
<button class="ExitButton" onclick="alert('Are you sure you want to exit BapClient?')">EXIT</button>
</div>
</button>
</body>
P粉5503233382023-09-16 12:01:17
在類別ExitButton中，transform: translate(700px, 300px);這一行負責將按鈕從[0,0]移到您提到的點：[700,300 ]。
透過刪除這行程式碼，您可以將按鈕放置在頁面的左上角。然後，您可以使用網格、佈局等方法將其位置變更為任何您想要的位置。